黑马程序员技术交流社区

标题: Vue的响应式原理 [打印本页]

---

作者: 小江哥    时间: 2019-12-10 16:39
标题: Vue的响应式原理


Vue的响应式原理一、Vue与MVVM

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

• View层：在Vue中是绑定对象的HTML
• ViewModel层：在Vue中是实例的vm对象
• Model层：在Vue中是data、computed、methods等的数据
  
  

二、Vue的响应式原理

Vue响应式底层实现方法是Object.defineProperty()方法,该方法中存在一个getter和setter的可选项，可以对属性的获取和设置造成影响

Vue中编写了一个wather来处理数据

在使用getter方法时，总会通知watcher实例对View层渲染页面

同样的，在使用setter方法时，总会在变更值的同时，通知watcher

三、响应式原理与兼容

由于Object.defineProperty()方法只支持IE9，所以Vue兼容IE版本最低为IE9，在IE9中，Vue的核心框架、vue-router、vuex是确保可以使用的

四、响应式原理示意图

响应式原理示意图.jpg (165.57 KB, 下载次数: 60)

下载附件

2019-12-10 16:41 上传

---

欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/)

黑马程序员IT技术论坛 X3.2