一、什么是生命周期
生命周期有多重叫法,有叫生命周期函数的,也有叫生命周期钩子的,还有钩子函数的,其实都是代表,在 Vue 实例创建、更新和销毁的不同阶段触发的一组钩子函数,这些生命周期函数允许开发者在不同阶段对 Vue 实例进行操作,以便执行特定的逻辑或清理工作。
生命周期主要包含以下四个阶段:创建、挂载、更新、销毁。好比一款手机,创建(拿到全新一款手机)、挂载(安装各种软件)、更新(系统或者软件升级)、销毁(丢弃手机)
二、Vue3中的生命周期函数
setup()是在beforeCreate和created之前运行的,所以可以用setup代替这两个钩子函数。
onBeforeMount():已经完成了模板的编译,但是组件还未挂载到DOM上的函数。
onMounted():组件挂载到DOM完成后执行的函数。
onBeforeUpdate():组件更新之前执行的函数。
onUpdated():由于数据更改导致的虚拟DOM重新渲染和打补丁,在这之后会调用该函数。
onBeforeUnmount():在组件实例被卸载之前调用。
onUnmounted():组件卸载完成后执行的函数
onActivated():若组件实例是 缓存树的一部分,当组件被插入到DOM中时调用。
onDeactivated():若组件实例是 缓存树的一部分,当组件从DOM中被移除时调用。
onErrorCaptured():在捕获了后代组件传递的错误时调用。