vue双向数据绑定原理Object.defineProperty详解

代码思路：

先给两个input的value赋一个初始值10

通过Object.defineProperty给obj对象的name属性，一个get和一个set方法

get方法是取obj.name属性的时候触发，set方法是给obj.name赋值的时候触发

通过input.value=obj.name，把obj.name的值取出来(被取值)通过等号赋值给input.value

给input绑定输入事件，通过obj.name=this.value把this.value的值通过等号赋值给obj.name,这样可以达到(当input事件触发后，会触发obj.name属性的set方法,set方法里面val参数就相当于触发事件后input.value的值，把值赋值给两个input来达到数据绑定)

注意：

不能同时设置（get和set）wrtable value，同时设置会报错，以下为错误信息

Invalid property descriptor. Cannot both specify accessors and a value or writable attribute

 

补充:

也可以这样写，效果一样