1.vue特性
vue框架有两个特性
- 数据驱动视图
- 双向数据绑定
1.1 数据驱动视图
在使用vue的页面中，vue会监听数据的变化，从而自动重新渲染页面的结构。示意图如下：
- 好处：当数据发生变化，页面会重新进行渲染
- 注意：数据驱动视图是单向数据绑定。
1.2 双向数据绑定
在填写表单时，双向数据绑定可以让开发者在不操作DOM的前提下，自动将用户所填写的最新的数据同步到数据源中。
-
好处：开发者可以不操作DOM，来获取表单元素的值
-
js数据的变化，会自动渲染到页面上
-
页面上数据的变化，会被vue自动同步到js数据中。
2.MVVM
MVVM是数据驱动视图和双向数据绑定的原理。MVVM指的是Model、View、ViewModel，它把每个HTML页面拆分了三个部分
- Model是页面渲染时所依赖的数据源
- View是指页面渲染的DOM结构
- ViewModel是指vue的实例，它是MVVM的核心
28.png
3.MVVM的工作原理
ViewModel是MVVM的核心，是它把当前页面的数据源(Model)和页面的结构(DOM)连接在了一起
- 当数据源发生变化时，会将ViewModel监听到，VM会根据最新的数据源自动更新DOM结构
- 当表单元素的值发生变化时，也会被VM监听到，VM会将变化过后最新的值自动同步到Model数据源中
29.png
4.总结
vue的简介.png
网友评论