vue2生命周期钩子函数有哪些

Vue 2 生命周期钩子函数

概述

Vue 2 生命周期钩子函数是在不同应用程序生命周期阶段执行的函数。这些函数允许开发人员在特定时刻自定义应用程序行为，例如在创建、挂载和销毁组件时。

生命周期钩子函数

立即学习“前端免费学习笔记（深入）”；

Vue 2 提供了以下生命周期钩子函数：

1. beforeCreate：在实例初始化后立即执行。
2. created：在实例创建完成后执行。
3. beforeMount：在挂载元素到 DOM 之前执行。
4. mounted：在挂载元素到 DOM 之后执行。
5. beforeUpdate：在更新 DOM 之前执行。
6. updated：在更新 DOM 之后执行。
7. activated：在子组件激活时执行（仅限 keep-alive）。
8. deactivated：在子组件停用时执行（仅限 keep-alive）。
9. beforeDestroy：在销毁实例之前执行。
10. destroyed：在销毁实例之后执行。

作用

生命周期钩子函数用于在以下常见场景中执行操作：

示例

考虑一个简单的 Vue 组件：

<template><div>{{ message }}</div></template><script>export default {  data() {    return {      message: 'Hello, Vue!'    };  },  mounted() {    console.log('Component has been mounted.');  },  beforeDestroy() {    console.log('Component will be destroyed.');  },};</script>

在此示例中：