vue中的mvvm模式讲解

学习了mvvm模式

起先还觉得有点难，后面与双向数据绑定链接起来还是很容易理解的。

那么什么是mvvm呢？

不明思议咋们肯定和我想的一样   每个单词的首写字母呗！

对没错就是它 model-view-viewmodel。  可以实现我们的双向数据绑定

下面我来用我的理解解析下它们之间的关系：

哈哈 有点小尴尬哈

先来说下view与model之间有联系吗？

在mvvm架构下，view 和 model 之间其实并没有直接的联系，而是通过viewmodel进行交互，model 和 viewmodel 之间的交互是双向的， 因此view 数据的变化会同步到model中，而model 数据的变化也会立即反应到view 上。

好啦，说到这可能有些小伙伴会问view 什么，model是什么？

model 层代表数据模型，也可以在model中定义数据修改和操作的业务逻辑；

view 代表ui 组件，它负责将数据模型转化成ui 展现出来，viewmodel 是一个同步view 和 model的对象。

vue是以数据为驱动的，vue自身将dom和数据进行绑定，一旦创建绑定，dom和数据将保持同步，每当数据发生变化，dom会跟着变化。

现在明白了吧！

好啦  我们继续谈谈它们三者之间的关系呀  它们之间是不是有个三角恋呐

哈哈  不错

viewmodel 通过双向数据绑定把 view 层和 model 层连接了起来，viewmodel里面包含dom listeners和data bindings，dom listeners和data bindings是实现双向绑定的关键。dom listeners监听页面所有view层dom元素的变化，当发生变化，model层的数据随之变化；data bindings监听model层的数据，当数据发生变化，view层的dom元素随之变化。

mvvm有什么好处呢  当然这个肯定有好处的 不然学它干哈

1. 低耦合。view可以独立于model变化和修改，一个viewmodel可以绑定到不同的view上，当view变化的时候model可以不变，当model变化的时候view也可以不变。

2. 可重用性。可以把一些视图的逻辑放在viewmodel里面，让很多view重用这段视图逻辑。

3. 独立开发。开发人员可以专注与业务逻辑和数据的开发(viewmodel)。设计人员可以专注于界面(view)的设计。

4. 可测试性。可以针对viewmodel来对界面(view)进行测试

咋们一起走向vue之路吧

总结

以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作具有一定的参考学习价值，谢谢大家对的支持。如果你想了解更多相关内容请查看下面相关链接