双向数据绑定

73 阅读1分钟

自己对知识的理解,留作面试用,如有错误请指正

初始化阶段

vue进入初始化阶段会有两个操作:数据监听和页面渲染

vue会用object.defineproperty对数据中的属性进行操作,实现数据监听;指令编译器compile对元素节点进行扫描和解析,初始化视图并订阅watcher来更新视图。此时watcher会将自己添加到信息订阅器dep中,初始化完毕

数据更新阶段

当数据更新的时候,发布者observer中的setter被触发,它会调用dep。notify,然后dep会去遍历订阅者watcher发送通知,并调用它的update方法。watcher收到更新通知后会对视图进行更新

至此,双向数据绑定完毕