什么是MVC/MVVM

Posted 2021-06-09 小白yang

缘起：刚才看一篇关于React与Angular区别的文章提到React是MVC中的V，Angular则是完整的MVC。作为非计算机专业靠自学“成才”的小白同学不禁要问了，究竟什么是MVC??

MVC是一种前端架构模式，MVVM是另一种更常见的前端架构模式。一种前端架构模式可以包含多个设计模式。

MVC

M: Model(数据层，数据变化)

V: View(视图层，页面展示)

C: Controller(控制层，对应用户对视图的操作，比如在input框输入，点击按钮等)

简而言之，用户看到视图（由数据-Model组成的视图-view），用户对视图进行操作（点击，输入等），js对用户事件进行响应（controller），改变数据层（Model)，重新渲染页面（view）

 

MVVM

VM: ViewModel（双向数据绑定，Model变化引起视图变化，视图变化引起Model变化）

MVVM与MVC最大的区别就是：它实现了View和Model的自动同步，也就是当Model的属性改变时，我们不用再自己手动操作Dom元素，来改变View的显示，而是改变属性后该属性对应View层显示会自动改变。

Vue.js是典型的MVVM框架模式

 

参考链接：https://blog.csdn.net/qq_36228442/article/details/79470408

https://blog.csdn.net/kwame211/article/details/107381932/ （React、Vue、Angular对比 ---- 介绍及优缺点）