双向数据绑定简直是咱们在vue中听到的最多的货色。v-model是咱们最常见的双向数据绑定指令。那么它到底是怎么实现的,一起手写一下。
<body> <input type='text'></body><script> let obj = {}; let temp; let ipt = document.querySelector('input'); ipt.oninput = function(){ obj.a = ipt.value; } //获取焦点 并且用户批改了值 Object.defineProperty(obj,'a',{ get:function(){ return temp; }, set:function(val){ temp = val; ipt.value = val; } }) //当咱们obj中的a属性发生变化后,input的值跟着扭转 //input的值发生变化后,obj的a属性也跟着扭转</script>