Vue学习：Vue的生命周期详细介绍

一、初识生命周期

Vue的生命周期是指Vue在关键时刻帮我们调用的一些特殊名称的函数，这些函数的名字不可更改，但函数的具体内容是程序员根据需求编写的。生命周期的this指向是vm或组件实例对象。

二、生命周期过程

简单来说。vm生命周期大致可分为如下步骤：

1、将要创建=》调用beforeCreate函数；

2、创建完毕=》调用created函数；

3、将要挂载=》调用beforeMount函数；

4、挂载完毕=》调用mounted函数；

5、将要更新=》调用beforeUpdate函数；

6、更新完毕=》调用updated函数；

7、将要销毁=》调用beforeDestroy函数

8、销毁完毕=》调用destroy函数。

详细来说：

在创建一个Vue实例后，首先执行的生命周期是beforeCreate函数，此时无法通过vm访问data中的数据、methods中的方法；

接着是created函数，此时可以通过vm访问data中的数据、methods中的方法；

接着是beforeMount函数，此时页面呈现的是未经编译的DOM结构，所有对DOM进行的操作都不生效；

再接着是mounted函数，此时页面呈现的是经过Vue编译后的DOM结构，对DOM的操作均有效；

然后是beforeUpdate函数，此时页面和数据尚未保持同步；

再然后是updated函数，此时页面和数据已经保持同步；

下面是beforeDestroy函数，此时vm中所有的data、指令、methods等都处于可用状态，马上要执行销毁过程。

最后是destroyed函数，对vue实例进行销毁；

关于销毁vue实例需要注意的是：

销毁后自定义事件会失效，但原生DOM事件依然有效。