基本原理
對(duì)于Getter/Setter實(shí)現(xiàn)的數(shù)據(jù)雙向綁定來說戒努，核心在于重定義model的getter與setter方法，在數(shù)據(jù)變動(dòng)的時(shí)候重新渲染頁面缘缚。
1.監(jiān)聽model屬性變化，當(dāng)屬性產(chǎn)生變化的時(shí)候齐媒，修改對(duì)應(yīng)對(duì)應(yīng)的節(jié)點(diǎn)內(nèi)容。
function getProxyModel() {
var obj = {}
var self = this;
var model = this.model;
var model2sync = this.model2sync; //model2sync 存放模型節(jié)點(diǎn)
each(Object.keys(model), function(i, k) {
Object.defineProperty(obj, k, {
set: function(v) {
model[k] = v
var arr = model2sync[k];
each(arr, function() {
this.node.textContent = self.renderStr(this.raw)
})
},
get: function() {
return model[k]
}
})
})
return obj
}
2.監(jiān)聽事件對(duì)view的變化唤崭，當(dāng)view修改后谢肾，修改對(duì)應(yīng)model的數(shù)值冕杠，觸發(fā)重新渲染。
// 綁定view事件
this.on(this.dom, ['keyup', 'click'], function(e) {
var name = e.target.name
if (name) {
if (e.target.value != self.model[name]) {
self.model[name] = e.target.value
}
}
})
