vue双向数据绑定原理(面试必备)

    科技2022-08-05  109

    原理

    vue.js是采用数据劫持结合发布者-订阅者的模式的方法,通过Object.defineProperty()来劫持各个属性的Getter、setter,在数据变动时发送消息给订阅者。

    实现的整个流程

    首先为每个vue属性用Object.defineProperty()实现数据劫持,为每个属性分配一个订阅者集合的管理数组dep;然后在编译的时候在该属性的数组dep中添加订阅者,v-model就会添加一个订阅者,接着为input添加监听事件,修改值就会为该属性赋值,触发该属性的set方法,在 set方法内通知订阅者数组dep,订阅者数组循环调用各订阅者的update方法更新视图。

    OK 这样回答就非常完美了

    Processed: 0.013, SQL: 8