MVVM 和MVC

• VUE属于MVVM框架，REACT属于MVC框架。它们两者都是渐进式增强框架，其本质都是想让开发者放弃直接操作DOM，转而更加关注视图和数据。那么这两种框架有什么不同呢？

MVVM

• mvvm是 view 视图层、model 数据层、viewModel 监听层的简称

• VIEW 视图层：vue通过 template、JSX 模板，来创建结构，构建视图

• MODEL 数据层：给视图提供所需的数据。其中包括有：

  • data\reactive\ref
  • props
  • computed
  • methods
  • ......

• VIEWMODEL 监听层： vue的核心，通过监听数据层和视图层，让数据和视图互通有无，进而实现数据的 双向驱动。

  • 数据驱动视图： 修改数据层，视图层跟着重新渲染最新数据
  • 视图驱动数据： 一般监听表单元素更改，自动修改相关数据

• 图例：

MVC

• MVC是： view 视图层、model 数据层、controller 控制层 的简称
• VIEW 视图层： react 通过 JSX 语法，去构建视图
• MODEL 数据层： 凡是在视图中动态处理的内容，都需要构建数据层
• CONTROLLER 控制层： 根据业务需求，当视图层中的数据发生变化，要去修改对应的数据，进而让视图发生变化，从而让用户看到最新的视图展示。
• 总结来说：当开发者想改变视图层中的信息，需要将model中对应的数据进行更改，react通过检测数据变化了，从而让视图按照最新的结构进行渲染；当用户在视图层触发了合成事件，那么需要去编写业务逻辑，然后由控制层去更改数据，进而控制视图重新渲染。
• 图例

不同点

• 数据驱动视图： 这个mvvm和mvc都是基本相似的。都是让数据去改变视图。
• 视图驱动数据： vue通过双向绑定的原则已经实现了。mvc没有实现这一层的操作，需要开发者自己来进行编写。