简述 Vue的双向数据绑定( MVVM 实现了什么,以及其diff算法所运行的位置 )。

7 篇文章 0 订阅
2 篇文章 0 订阅

MVVM 实现了什么。

mvvm

    View(dom) ? ViewModel ? Model(javascript)
    Model通过vm数据绑定(Date Binding)来更新View代码(updateView)
	M ? V
	Model的动态变化 通过vm 动态更新到View。
	1.VM实现了一个数据监听器(Observe)进行数据劫持,当数据改变的时候通知订阅者(Watcher)[“diff算法在watcher的update方法里面。”],Watcher接收到需要更新的数据,更新View(视图)。
	2.实现了一个Compile(解析指令),将模版中的变量替换成数据{{****}},并绑定更新函数,添加数据订阅者(Watcher)。一旦数据变动,接收通知改变视图。
	View(dom) ? ViewModel ? Model(javascript)
    vm监听dom事件的变化(DOM Listeners),Model随着View触发事件而改变
	V ? M
	View的触发事件,通过vm 实现Dom元素监听者(Dom Listener)监听事件触发,从而触发Model事件变化。
	当Model事件变化的时候执行M->V过程进行更新视图

触发render(渲染dom)的时机。

VM实例初始化时。

Model动态修改时。

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值