vue组件生命周期钩子函数

Vue 组件的生命周期

​ vue组件在整个生命周期里面提供了一些函数，可以在内部实现一些业务逻辑，一个组件创建或者vue实例创建之后，内部会做一些初始化事件与生命周期相关的配置，组件的生命周期钩子函数大致可以分为三个阶段：初始化、运行中、销毁。

初始化阶段：

1.beforeCreate

在实例初始化之后，数据观测(data observer) 和 event/watcher 事件配置之前被调用。实例中的数据不能获取到，页面中的Dom元素也没有渲染。

2.created

钩子函数内部的数据已经被挂载了，但是真实dom节点还是没有渲染出来。

3.beforeMount

此时内存中的模板结构，还没有真正渲染到页面上，页面上看不到真实的数据，用户看到的只是一个模板页面而已。

4.mounted

数据已经挂载完毕了，真实的dom也已经渲染出来了。

运行中阶段：

1.beforeUpdate

在执行beforeUpdate运行中的生命周期函数的时候，数据肯定是最新的；但是页面上呈现的数据还是旧的

只有dom挂载完毕了，然后再去当数据发生变化的时候，beforeUpdate这个钩子函数才会执行

2.updated

页面也完成了更新，此时，data数据是最新的，同时，页面上呈现的数据也只最新的。

销毁阶段：

1. beforeDestroy

   当执行beforeDestroy的时候，组件即将被销毁，但是还没有真正开始销毁，此时组件还是正常可用的；data、methods等数据或方法，依旧可以被正常访问。

2. destroyed

组件已完成了销毁，组件无法使用，data和methods都不可使用。