vue数据双向绑定MVVM原理(简易版)

你讲一下Vue的双向绑定原理吧?(这句话怎么那么熟悉呢?)

这就是在考察你MVVM了解有多少

要先知道一个方法:Object.defineProperty(),

这是原生js就自带的方法。vue也是js,他就是一个封装了js的库而已。

Object.defineProperty()方法会直接在一个对象上定义一个新属性,或者修改一个对象的现有属性。

Vue的原理:

Object.defineProperty(对象,属性名,{get set 等配置})

比如你在编码过程中写了这么一行代码:this.name = "张三",就会触发set

总结就是:

vue通过原生的js的Object.defineProperty监听到了我们写的data数据,这个data里面的数据有修改就会触发Object.defineProperty里面的set;

在set里面我们可以获取到最新的修改的值,去页面上正则匹配到对应地方替换修改

posted @ 2020-05-16 14:34  天空003  阅读(206)  评论(0编辑  收藏  举报