声明周期的变化
整体来看 变化不大,使用setup代替了之前的beforeCreate和created,其他生命周期名字有些变化,功能都是没有变化的
使用proxy代替defineProperty
vue无法实现对数组对象的深层监听? 因为组件每次渲染都是将data里的数据通过defineProperty进行响应式或者双向绑定上,之前没有后加的属性是不会被绑定上的,也就不会触发更新渲染
object.defineProperty()语法
Proxy语法
对比以上两种语法,defineProperty只能响应首次渲染时候的属性,Proxy需要的是整体,不需要关心里面有什么属性。
组件基本结构分析
生命周期的使用
执行结果
组合API的使用
setup setup 替代了以前的beforeCreate和created,类似于初始化的功能 父组件
子组件
打印结果如下
如果想要获取更多当前组件的相关属性,可以从组合API里引用getCurrentInstance
ref、toRef、toRefs