VUE3响应式数据

 

内存中两块空间一个数mydata储存空间，另一个节点对象，在文档树中用于页面显示的，里面有一个innerHTML属性，这个属性决定页面显示效果

前提设置了一个全局变量Let mydata={title:"我也是个数据容器"}

当mydata存储空间修改后，但是innerHTML没有运行，导致页面的mydata没有运行，页面首次加载innerHTML赋值,然后去了变量存储空间中的字符串，显示出来，innerHTML不会再运行，变量存储空间中的数据发生修改，由于innerHTML没有运行所以不会打印修改后的变量在页面显示

 

 

劫持原理

vue2.0采用 es5中的pbject.defineproperty(set（）get（））

vue3.0采用es6中的proxy代理

响应式数据就是data数据源发生了改变,页面上凡是使用了数据容器的地方就会重新取值重绘

 这种数据容器的就是响应式的

响应式数据的原理：我们传入的data数据源会被vm对象劫持,底层设计采用发布者/订阅者的设计模式设计

设计出来的 底层js语法的Object.defineProty来实现的,watch监听了每一个属性的getter和setter函数

只要属性被修改就会被执行 修改值和刷新页面