MVVM、MVC 的区别

MVC

MVC就是 Modal，View ，Control的缩写

模型：主要包含业务数据和业务逻辑。在模型层，还会涉及到用户发布的服务，在服务中会根据不同的业务需求，更新业务模型中的数据。

视图：呈现给用户的部分，是用户和程序交互的接口，用户会根据具体的业务需求，在View视图层输入自己特定的业务数据，并通过界面的事件交互，将对应的输入参数提交给后台控制器进行处理。

控制器：用来处理用户输入数据，已经更新业务模型的部分。控制器中接收了用户与界面交互时传递过来的数据，并根据数据业务逻辑来执行服务的调用和更新业务模型的数据和状态。

模型作用图：

MVC的处理过程：

• 首先控制器接受用户的请求，调用相应的模型Modal来进行业务处理，并返回数据给控制器control。
• 控制器调用相应的视图view来显示处理的结果。
• 并通过视图呈现给用户。实现人机数据之间的交互。

MVC是单向通信，view 和modal都要通过control来进行通信

MVVM

MVVM分为三个部分：

• 分别是M（Model，模型层 ）
• V（View，视图层），VM（ViewMode)
• V与M连接的桥梁，也可以看作为控制器）

1、 M：模型层，主要负责业务数据相关 也就是<script></script>里面的东西；

2、 V：视图层，顾名思义，负责视图相关，细分下来就是html+css层 也就是<template><template>；

3、 VM：V与M沟通的桥梁，负责监听M或者V的修改，是实现MVVM双向绑定的要点；就可以理解成vue底层帮我们做的数据与模板的绑定 MVVM支持双向绑定， 意思就是:

• 当M层数据进行修改时，VM层会监测到变化，并且通知V层进行相应的修改，
• 反之修改V层则会通知M层数据进行修改，以此也实现了视图与模型层的相互解耦；

MVVM 和 MVC 的区别

MVC和MVVM的区别并不是VM完全取代了C，ViewModel存在目的在于抽离Controller中展示的业务逻辑，而不是替代Controller，其它视图操作业务等还是应该放在Controller中实现。也就是说MVVM实现的是业务逻辑组件的重用。

• MVC中Controller演变成MVVM中的ViewModel

• MVVM通过数据来显示视图层而不是节点操作

• MVVM主要解决了MVC中大量的dom操作使页面渲染性能降低,加载速度变慢,影响用户体验

vue官方说：vue并未严格遵守MVVM模型

严格的 MVVM 要求 View 不能和 Model 直接通信，而 Vue 提供了$refs 这个属性，让 Model 可以直接操作 View，违反了这一规定，所以说 Vue 没有完全遵循 MVVM。