生命周期函数，指的就是 Vue 在组件的整个生命周期的过程中，给组件添加了八个函数。当组件的生命周期进入到某一个阶段时，就会自动执行对应的函数。
我们通过下面的表格来看一下 Vue 中的八个生命周期函数：

函数名 阶段 描述
beforeCreate 初始化 组件创建前。
此阶段组件的选项还未挂载，因此无法访问 methods、data、computed 上的方法或数据。
created 初始化 组件创建完成。
此阶段可以查看到数据，但是组件的 DOM 节点并未渲染。
beforeMount 初始化 组件挂载前。
组件 DOM 节点渲染之前，相关的 render 函数首次被调用。
mounted 初始化 组件挂载完成。
组件 DOM 节点渲染完成，此阶段可以操作真实 DOM 节点，也可以向后端发起请求。
beforeUpdate 更新 组件更新前。
当组件的数据更新前进入此阶段。此时虚拟节点都还没有重新渲染。
updated 更新 组件更新完成。
数据更改，DOM 节点重新渲染。
beforeDestroy 销毁 组件销毁前。
调用vm.$destroy()方法可销毁组件，在此阶段，组件仍然完全可用。
destroyed 销毁 组件销毁完成。
此阶段组件所有的属性都会解绑，所有的事件监听器被移除。所有的子组件也都会呗销毁。

注意：应避免在updated中更改状态，可能会导致更新无限循环。

常用生命周期函数

Vue 中总共提供了八个生命周期函数，但并不是每一个都必须使用。在实际项目开发中，我们可以只选择需要的函数。
例如，created生命周期函数，我们通常在这个阶段向后端发起网络请求：

  1.  export default {
  2.      created() {
  3.          this.getData();
  4.      },
  5.      methods: {
  6.          getData() {
  7.              // ... 发起网络请求
  8.          }
  9.      }
  10.  }

生命周期函数图解

生命周期函数 - 图1