1,Vue.js 采用的是 数据劫持+发布/订阅模式 的方式,通过 Object.defineProperty() 来劫持各个属性的 setter/getter, 在数据变动时发布消息给订阅者(Wacther), 触发相应的监听回调
2,简单实现
<htmllang="en">
<head><title>双向绑定最最最初级demo</title><metacharset="UTF-8"></head><body><divid="app"><inputtype="text"id="txt"><pid="show-txt"></p></div></body><script>varobj={}Object.defineProperty(obj,'txt',{get:function(){returnobj},set:function(newValue){document.getElementById('txt').value=newValuedocument.getElementById('show-txt').innerHTML=newValue}})document.addEventListener('keyup',function(e){obj.txt=e.target.value})</script>
网友评论