vue3文档速览之生命周期
作者:互联网
https://v3.cn.vuejs.org/
官网yyds
首先作为一个半吊子vue2的开发者,让我对vue3产生兴趣的理由无非就是,‘打包迅速’,‘编译快’,‘开发效率直线提升2倍’等等的宣传。这期我们来看一下生命周期方向vue3 对于 vue2 有什么改变。
生命周期
首先来看一下两个生命周期的对比
vue2历史的八大生命周期还历历在目:
beforeCreate: 组件实例刚被创建, 组件属性计算之前, 如data属性等
created: 组件实例创建完成, 属性已绑定, 但DOM还未生成, *$el* 属性还不存在
beforeMount: 模版编译/挂载之前
mounted: 模版编译/挂载之后(*不保证组件已在document中*)
beforeUpdate: 组件更新之前
updated: 组件更新之后
beforeDestory: 组件销毁前调用
destory: 组件销毁后调用
而落实到vue3中,最后两个beforeDestory和destory已经在版本的更迭中被取代了。
取而代之是新的生命周期与钩子函数:
因为setup是围绕beforeCreate 和 created 生命周期钩子运行的,所以不需要显式地定义它们。
换句话说,在这些钩子种编写的任何代码都应该直接在setup函数中编写。
// MyBook.vue
export default {
setup() {
// mounted
onMounted(() => {
console.log('Component is mounted!')
})
}
}
标签:生命周期,setup,速览,文档,vue2,vue3,组件,mounted 来源: https://blog.csdn.net/qq_43277404/article/details/121790608