MVVM设计模式(ViewModel))

187 阅读1分钟

1.旧前端代码三大部分划分

(1)HTML 只负责保存页面的静态内容
(2)CSS  只负责保存页面所需的静态css样式
(3)JS   负责所有页面上的增删改查操作!

2.问题

(1). HTML和css因为缺少程序必须的要素(变量、分支、循环),就好像生活不能自理的小婴儿!
(2). 所有增删改查操作,都要js程序来负责,导致大量重复的代码!

3.MVVM设计模式

对前端代码重新划分:三部分

(1).界面(View):

a. 等于HTML+CSS
b. HTML增加了变量、分支、循环等程序功能

(2)模型对象(Model)

专门保存页面所需的变量和事件处理函数的对象

(3)视图模型(ViewModel)对象

专门负责自动将变量和事件处理函数送到界面中指定位置——将界面和模型对象绑定在了一起。

4.MVVM最大的优点

因为ViewModel可自动维护模型对象内容与界面之间保持一致,所以减少了大量重复的编码!

5.Vue框架正是基于MVVM模式实现的!