vue3自学理论笔记

项目不忙时就学习新内容，知识不全。

 

1.vue2使用es5中的object.definedPropert对数据进行双向绑定

2.vue3是使用es6的ProxyApl对数据进行处理的

3.vue3使用perxy的优势是，vue2只能监听某个属性，不能监听对象，而vue3可以监听数组，可以检测到数组内部的数据变化

4.vue2的组件只能有一个根节点，而vue3组件可以有多个根节点

5.最大的区别是vue2把数据放到data属性中，methods放方法，watch监听，created生命周期先触发，而vue3新增setup,此方法是在组件初始化构造的时候触发的，从vue引入reactive，使用此方法来生命我们的数据为响应式数据，使用setup方法来返回我们的响应性数据，从而我们的template可以获取这些响应数据

6.vue3中的setup接受两个参数（props，context），vue3生命周期setup是在beforeCreate和created之前去执行，创建的是data和method，其他所有的生命周期比vue2都多了on

7.执行setup，组件实例尚未被 创建，this不会是该活跃实例的引用，既不指向vue实例，为了避免错误，直接将setup函数中的this修改成了undefined

8.setup是i响应式的，当传入新的prop时，它将被更新，因为props是响应式的，不能使用es6解构，因为会消除prop的响应式。如果需要解构props，可以使用setup中的toRefs来进行解构

9.子传父事件，vue2中使用的是this.$emit进行传参，在vue3中只要在setip中接受的第二个参数centext，使用分解对象{}方法取出emit就可以了，另外，context是一个普通的js对象，不是响应式的，所以可以使用es6解构{}。

10.setup只能是同步的，