首页 > 其他分享 >Vue3的生命周期

Vue3的生命周期

时间:2023-11-06 12:46:15浏览次数:28  
标签:生命周期 函数 钩子 setup Vue3 组件 执行

1、setup() : 开始创建组件之前,在 beforeCreate 和 created 之前执行,创建的是 data 和 method

2、onBeforeMount() : 组件挂载到节点上之前执行的函数;

3、onMounted() : 组件挂载完成后执行的函数;

4、onBeforeUpdate(): 组件更新之前执行的函数;

5、onUpdated(): 组件更新完成之后执行的函数;

6、onBeforeUnmount(): 组件卸载之前执行的函数;

7、onUnmounted(): 组件卸载完成后执行的函数;

8、onActivated(): 被包含在 <keep-alive> 中的组件,会多出两个生命周期钩子函数,被激活时执行;

9、onDeactivated(): 比如从 A 组件,切换到 B 组件,A 组件消失时执行;

10、onErrorCaptured(): 当捕获一个来自子孙组件的异常时激活钩子函数。

 

Vue3.0中可以继续使用Vue2.x中的生命周期钩子,但有两个名字变了:

    beforeDestroy 改名为 beforeUnmount

    destroyed 改名为 unmounted

Vue3.0 也提供了Composition API 形式的生命周期钩子,与Vue2.x 中钩子对应关系如下:

   beforeCreate ==> setup()

   created ==> setup()

   beforeMount ==> onBeforeMount

   mounted ==> onMounted

   beforeUpdate ==> onBeforeUpdate

   updated ==> onUpdated

   beforeUnmount ==> onBeforeUnmount

   unmounted ==> onUnmounted

标签:生命周期,函数,钩子,setup,Vue3,组件,执行
From: https://www.cnblogs.com/buluzombie/p/17812384.html

相关文章