vue原理介绍

vue原理介绍

vue 是一套用于构建用户界面的渐进式框架。它的核心库只关注视图，采用的mvvm设计模式。vue的中心思想就是：数据驱动视图

mvvm

“MVVM”: model view viewmodelMVVM的调用关系和MVP一样。但是，在ViewModel当中会有一个叫Binder，或者是Data-binding engine的东西。你只需要在View的模版语法当中，指令式地声明View上的显示的内容是和Model的哪一块数据绑定的。当ViewModel对进行Model更新的时候，Binder会自动把数据更新到View上去，当用户对View进行操作（例如表单输入），Binder也会自动把数据更新到Model上去。这种方式称为：Two-way data-binding，双向数据绑定。

可以简单而不恰当地理解为一个模版引擎，但是会根据数据变更实时渲染。

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-VvZhWbyI-1617877426554)(C:\Users\xujing\AppData\Roaming\Typora\typora-user-images\image-20210327110959874.png)]

Vue是一个 MVVM框架，其各层的对应关系如下

• Model：负责数据存储 ； Model层在Vue中是data、computed、methods等中的数据

• View：负责页面展示 ； View层在Vue中是绑定dom对象的HTML

• View Model：负责业务逻辑处理（比如Ajax请求等），对数据进行加工后交给视图展示 ； View Model层在Vue中是实例的vm对

  在 Model 层的数据变化时，View层会在ViewModel的作用下，实现自动更新

• 面试：对于 MVVM 的理解？

MVVM 是 Model-View-ViewModel 的缩写。

Model 代表数据模型，也可以在 Model 中定义数据修改和操作的业务逻辑。

View 代表 UI 组件，它负责将数据模型转化成 UI 展现出来。

ViewModel 监听模型数据的改变和控制视图行为、处理用户交互，简单理解就是一个同步 View 和 Model 的对象，连接 Model 和 View。

在 MVVM 架构下