VUE3.0快速上手，常用API

VUE2.0中响应式原理

用ES5的Object.defineProperty语法的get和set对数据进行监听，更新dom的内容实现动态绑定数据。
缺点：不能劫持对象的新增属性，或删除属性，需要用到$set。数组的下标也不行，数组的push方法可以。
可参考官方文档：深入响应式原理

VUE3.0中响应式

使用ES6的proxy语法，解决了2.0的缺点。

可动态绑定对象属性的新增删除等，不需要像2.0中使用$set

VUE2.0的optionsAPI和VUE3.0的compositionAPI对比

VUE2.0中，函数功能A的返回值，方法要放在指定的位置，不容易复用，项目功能较多后，浏览麻烦，不好维护

VUE3.0中放到setup中，每个函数功能的代码放在一起，便于阅读和维护

VUE3.0之setup函数

• setup函数作为compositions API的起点
• 从生命周期函数来看，setup会在beforeCreate钩子函数之前执行
• setup中不能使用this，会指向undefined

reactive和ref动态绑定数据

• reactive绑定复杂数据；
• ref绑定简单数据，返回一个对象；
• 在setup中使用ref绑定的值时需要调用对象的value属性；在模板中不用，会自动解套，自动调用value

toRefs

…表示展开，在模板中可以直接使用money或car.price而不是state.money；
若不加toRefs，展开后，money和name属性在模板中不是响应式的；

视频快速讲解toRefs

钩子函数变化