设计架构 | MVVM模型

前言：本文简单介绍了MVVM，作为Vue开发的设计思想，学习MVVM将有助于我们深入理解Vue的目的与原理，是在现有的MVC基础上的扩展。

简介

MVVM (Model-View-ViewModel)，响应式编程模型，目的是分离视图 (View) 和模型 (Model) ，避免直接操作DOM，降低DOM操作的复杂性，是一种设计思想。Vue在设计上一定程度上借鉴了这种思想。

MVVM：页面输入改变数据，数据改变影响页面的数据展示与渲染

• M (Mode)：普通的Javascript数据对象
• V (View)：前端展示页面
• VM (ViewModel)：用于双向绑定（数据与页面），就是Vue示例

特点

1. 低耦合
2. 可重用性
3. 独立开发
4. 可测试

实例

在实际的代码中，MVVM模式是如下图表现，通过ViewModel在View和Model之间做一个中间商，通过它联系两端，并实现数据的双向绑定