动手实现数据双向绑定Getter/Setter(2)

基本原理

对于Getter/Setter实现的数据双向绑定来说，核心在于重定义model的getter与setter方法，在数据变动的时候重新渲染页面。

1.监听model属性变化，当属性产生变化的时候，修改对应对应的节点内容。

function getProxyModel() {
    var obj = {}
    var self = this;
    var model = this.model;
    var model2sync = this.model2sync; //model2sync 存放模型节点
    
    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.监听事件对view的变化，当view修改后，修改对应model的数值，触发重新渲染。

// 绑定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
    }
  }
})

代码参考：
http://codepen.io/youyudehexie/pen/BjQZEo