生命周期

生命周期图示

2.x

3.x

生命周期钩子函数名称

2.x

• beforeCreate：实例刚被创建，数据和事件尚未初始化。

• created：例已经创建完成，数据和事件已经初始化，但 DOM 还未渲染。

• beforeMount：挂载开始之前调用，相关的 render 函数首次被调用。

• mounted：例挂载到 DOM 后调用，此时可以访问到真实的 DOM 元素。

• beforeUpdate：据更新后，DOM 发生更新之前调用。

• updated：据更新后，DOM 更新完成后调用。

• beforeDestroy：例销毁之前调用，实例仍然可用。

• destroyed：例销毁后调用，此时组件的 DOM 和数据都被销毁。

• activated：被 keep-alive 缓存的组件激活时调用。

• deactivated：被 keep-alive 缓存的组件失活时调用。

• errorCaptured：https://v2.cn.vuejs.org/v2/api/#errorCaptured

3.x

• onBeforeMount：注册一个钩子，在组件被挂载之前被调用。

• onMounted：注册一个回调函数，在组件挂载完成后执行。

• onBeforeUpdate：注册一个钩子，在组件即将因为响应式状态变更而更新其 DOM 树之前调用。

• onUpdated：注册一个回调函数，在组件因为响应式状态变更而更新其 DOM 树之后调用。

• onBeforeUnmount：注册一个钩子，在组件实例被卸载之前调用。

• onUnmounted：注册一个回调函数，在组件实例被卸载之后调用。

• onActivated：注册一个回调函数，若组件实例是 <KeepAlive> 缓存树的一部分，当组件被插入到 DOM 中时调用。

• onDeactivated：注册一个回调函数，若组件实例是 <KeepAlive> 缓存树的一部分，当组件从 DOM 中被移除时调用。

• onRenderTracked Dev only：注册一个调试钩子，当组件渲染过程中追踪到响应式依赖时调用。

• onRenderTriggered Dev only：注册一个调试钩子，当响应式依赖的变更触发了组件渲染时调用。

• onErrorCaptured：https://cn.vuejs.org/api/composition-api-lifecycle.html#onerrorcaptured

• onServerPrefetch SSR only：注册一个异步函数，在组件实例在服务器上被渲染之前调用。