Vue实例生命周期中的所有钩子函数

在 Vue 3 中，实例生命周期的钩子函数被整合为了两个主要的阶段：Composition API 阶段和 Options API 阶段。下面是 Vue 3 中的所有生命周期钩子函数：

Composition API 阶段：

setup  //在组件实例创建之前执行，用于设置组件的初始状态和行为。它是 Composition API 的入口点。

Options API 阶段：

beforeCreate  //在实例被创建之前执行，此时数据和事件还未初始化。

created  //实例已经创建完成，数据和事件已初始化，但尚未挂载到 DOM。

beforeMount //在 DOM 挂载之前被调用。

mounted  //DOM 挂载完成后调用，此时组件已经显示在页面上。

beforeUpdate  //在数据更新之前调用，发生在虚拟 DOM 重新渲染和打补丁之前。

updated  //数据更新完成后调用，组件的数据和 DOM 都已更新。

beforeUnmount  //在实例销毁之前调用，此时组件还存在。

unmounted  //实例被销毁后调用，组件已被移出 DOM。

errorCaptured //捕获到子孙组件抛出的错误时调用。

每个钩子函数都有其特定的用途，你可以在相应的阶段执行一些逻辑，从而实现不同的功能。Composition API 阶段的 setup 钩子与 Options API 阶段的其他钩子是分离的，但你可以在 setup 钩子中访问 Options API 阶段的数据和方法。

需要注意的是，在 Vue 3 中，被认为是「已弃用」或「不推荐使用」的生命周期钩子函数有：beforeDestroy（使用 beforeUnmount 替代）、destroyed（使用 unmounted 替代）和 activated、deactivated。你应该尽量遵循官方文档的建议来使用适当的生命周期钩子函数。