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官网网站

上一篇下一篇

猜你喜欢

热点阅读