vue3生命周期

• vue3 的钩子函数基本是再 vue2 的基础上加了一个on,但也有两个钩子函数发生了变化。BeforeDestroy变成了onBeforeUnmount，destroyed变成了onUnmounted（尤大神的介绍是mount比Destroy更形象，也和beforeMount相对应。）
• 除了这些钩子函数外，Vue3.x还增加了用来调试使用的onRenderTracked和onRenderTriggered函数。
• Vue3.x 生命周期在调用前需要先进行引入import { reactive, toRefs, onMounted, onBeforeMount, onBeforeUpdate, onUpdated, } from "vue";

Vue2	vue3
beforeCreate	setup()	setup() :开始创建组件之前，在beforeCreate和created之前执行。创建的是data和method
created	setup()
beforeMount	onBeforeMount	组件挂载到节点上之前执行的函数。
mounted	onMounted	组件挂载完成后执行的函数。
beforeUpdate	onBeforeUpdate	组件更新之前执行的函数。
updated	onUpdated	组件更新完成之后执行的函数。
beforeDestroy	onBeforeUnmount	组件卸载之前执行的函数。
destroyed	onUnmounted	组件卸载完成后执行的函数
activated	onActivated	被包含在中的组件，会多出两个生命周期钩子函数。被激活时执行。
deactivated	onDeactivated	比如从 A 组件，切换到 B 组件，A 组件消失时执行。
errorCaptured	onErrorCaptured	当捕获一个来自子孙组件的异常时激活钩子函数。

注：使用组件会将数据保留在内存中，比如我们不想每次看到一个页面都重新加载数据，就可以使用组件解决。

• vue3的钩子函数在对应的vue2钩子函数前执行。实际项目中只用一套。如果你使用 Vue3，请尽量使用新的生命周期钩子函数，也就是写在setup()函数中带on的这些钩子函数。

  
  

https://www.jspang.com/detailed?id=64#toc325