脚本宝典收集整理的这篇文章主要介绍了订阅发布和vue双向绑定,脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。
最近在看vue的源码,有些感触,下面阐述一些个人理解。
之前写过一篇文章,是讲述关于观察者模式的,与本文主旨有关,需要的朋友可以看一下。
vue的核心是mvvm,vue2又增加了虚拟dom。
我的研究方向也是以这两个为主。
本文主要讲述mvvm,至于vdom(主要研究方向是整个思想和diff算法)下次再论述。
m(model)v(view)vm(view-model),重要特性双向绑定,m和v之间无耦合,通过操作m,利用vm提供的机制,自动实现v的更新。用过vue应该会有较深体会。
和其相对比比较容易误解是mvc,m(model)v(view)c(controller),和mvvm的显著区别是m和v之间存在耦合,业务逻辑集中在c当中。 用过springmvc应该会有体会。
说明 解析不包括模板、指令、Mustache等,因为模板编译、解析等和本文核心主题无关,这些仅仅是基于双向绑定的应用场景。本文主题想讨论的是->结合观察者模式简单实现双向绑定的核心。
双向绑定的核心是实现Dep、observer、Watcher。
结合下图,以便于大致理解。
关于其执行流程具体如下,上述示例图中画的其实也只是大致流程,实现过程中有很多细节,列举几个我认为比较重要的。
至于观察者模式是如何在其中体现呢?
observer和Watcher是一对多的关系,连接机制通过dep(其中注册了一些观察者), 消息触发根源是user,其行为导致model改变,被观察者(data)进行notify, 具体订阅者watcher执行自己预先定义好的update逻辑。
整个过程很好的体现了注册-通知的机制。
这篇文章分析基于Vue(Version 2.2.6),示例中图画的丑,画图真心不易。个人观点,如有不同理解,欢迎comment。
以上是脚本宝典为你收集整理的订阅发布和vue双向绑定全部内容,希望文章能够帮你解决订阅发布和vue双向绑定所遇到的问题。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。