Vue.js数据双向绑定原理(MVVM模式)
2020-03-20 本文已影响0人
小姨妈1596
首先需要一个监听器Observer监听数据(model)的变化,具体实现是利用Observer中Object.definePrototype()函数实现监听数据。
当数据发生变化就通知订阅者Watcher通知并执行绑定的更新函数,从而更新视图。
最后需要一个Compile解析器,解析V-model、V-on等节点,绑定对应的更新函数并初始化这类节点的模板数据。
MVVM模式概念:MVVM模式就是Model–View–ViewModel模式。它实现了View的变动,自动反映在 ViewModel。相反的,ViewModel的变动也会自动反应在View。ViewModel是作为Model和View桥梁的存在。
示意图可参考Vue.js官方文档中的这一章节:vue.js官网网站