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 架构下