vue__双向数据绑定v-model
- 双向数据绑定是建立在单项数据绑定(model===view)的基础之上的
- 双向数据绑定的实现流程:
a: 在解析v-model指令时 , 给当前元素添加input监听
b: 当input的 value发生改变时, 将最新的值赋值给当前表达式对应的data属性 - v-model:绑定
model:function(node,vm,exp){ // 实现数据的初始化显示 和创建对应的 watcher this.bind(node,bm,exp,'model'); var me = this, // 得到表达式的值 val = this._gitVMVal(vm,exp) // 给节点绑定input事件监听(输入改变时) node.addEventListener('input',function(e){ // 得到输入的最新值 var newValue = e.target.value; // 如果没有变化, 直接结束 if(val === newValue){ return } // 将最新的value保存给表达式所对应的属性 me._setVMVal(vm,exp,newValue); val = newValue }) }