mvvm框架是什么 它和其他框架的区别

JavaScript016

mvvm框架是什么 它和其他框架的区别,第1张

在MVC里,View是可以直接访问Model的!从而,View里会包含Model信息,不可避免的还要包括一些业务逻辑。 MVC模型关注的是Model的不变,所以,在MVC模型里,Model不依赖于View,但是 View是依赖于Model的。不仅如此,因为有一些业务逻辑在View里实现了,导致要更改View也是比较困难的,至少那些业务逻辑是无法重用的。

MVVM在概念上是真正将页面与数据逻辑分离的模式,它把数据绑定工作放到一个JS里去实现,而这个JS文件的主要功能是完成数据的绑定,即把model绑定到UI的元素上。

有人做过测试:使用Angular(MVVM)代替Backbone(MVC)来开发,代码可以减少一半。

此外,MVVM另一个重要特性,双向绑定。它更方便你同时维护页面上都依赖于某个字段的N个区域,而不用手动更新它们。

M:Model(服务器上的业务逻辑操作)

V:View(页面)

VM:ViewModel(Model与View之间核心枢纽,比如Vue.js)

双向是指ViewModel中的data部分和View之间的双向关系。

正向:数据驱动页面

反向:页面更新数据

绑定是指自动化处理,data改变了view随之改变,反之也是。

不用像传统方式那样,通过onChange事件获取用户输入,然后再通过改变innerHtml修改显示。

双向绑定都是依赖ES5中一个重要的API,Object.defineProperty。

定义:

Object.defineProperty() 方法会直接在一个对象上定义一个新属性,或者修改一个对象的现有属性, 并返回这个对象。

语法:

Object.defineProperty(obj, prop, descriptor)

参数:

obj:要在其上定义属性的对象。

prop:要定义或修改的属性的名称。

descriptor:将被定义或修改的属性描述符。

返回值:

被传递给函数的对象。

。。。

MVVM 是 Model-View-ViewModel 的缩写。

Model 代表数据模型,也可以在 Model 中定义数据修改和操作的业务逻辑。View 代表 UI 组件,它负责将数据模型转化成 UI 展现出来。 ViewModel 监听模型数据的改变和控制视图行为、处理用户交互,简单理解就是一个同步 View 和 Model 的对象, 连接 Model 和 View。

在 MVVM 架构下,View 和 Model 之间并没有直接的联系,而是通过 ViewModel 进行交互,Model 和 ViewModel 之间的交互是双向的, 因此 View 数据的变化会同步到 Model 中,而 Model 数据的变化也会立即反应到 View 上。

区别:vue 数据驱动,通过数据来显示视图层而不是节点操作。

场景:数据操作比较多的场景,更加便捷