vue生命周期

生命周期的钩子一共分为8个阶段：创建前后、载入前后、更新前后、销毁前后

创建前/后:

• beforeCreate（创建前）：vue实例的挂载元素$el和数据对象 data都是undefined, 还未初始化
• created (创建后) ：实例创建完成后，完成了 data数据初始化, 但是el还未初始化。

载入前/后：

• beforeMount (载入前)： vue实例的$el和data都初始化了, 相关的render函数首次被调用。实例已完成以下的配置：编译模板，把data里面的数据和模板生成html。注意此时还没有挂载html到页面上。
• mounted (载入后) ：在el 被新创建的 vm.$el替换，并挂载到实例上去之后调用。实例已完成以下的配置：用上面编译好的html内容替换el属性指向的DOM对象。完成模板中的html渲染到html页面中。

更新前/后：

• beforeUpdate (更新前)： 在数据更新之前调用，发生在虚拟DOM重新渲染和打补丁之前。可以在该钩子中进一步地更改状态，不会触发附加的重渲染过程
• updated （更新后） ：在由于数据更改导致的虚拟DOM重新渲染和打补丁之后调用。调用时，组件DOM已经更新，所以可以执行依赖于DOM的操作。

销毁前/后：

• beforeDestroy (销毁前） ：在实例销毁之前调用。实例仍然完全可用。
• destroyed (销毁后） ：在实例销毁之后调用。调用后，所有的事件监听器会被移除，所有的子实例也会被销毁。

当组件被keep-alive包裹时，会多出两个钩子

• activated 组件激活时调用。
• deactivated 组件停用时调用。

父子组件的生命周期

1. 加载渲染过程

父beforeCreate->父created->父beforeMount->子beforeCreate->子created->子beforeMount->子mounted->父mounted

2. 子组件更新过程

父beforeUpdate->子beforeUpdate->子updated->父updated

3. 销毁过程

父beforeDestroy->子beforeDestroy->子destroyed->父destroyed

生命周期	描述
beforeCreate	组件实例被创建之初，组件的属性生效之前，实例刚在内存中被创建出来，此时，还没有初始化好data 和 methods 属性
created	组件实例已经完全创建，属性也绑定，但真实 dom 还没有生成，$el 还不可用
beforeMount	在挂载开始之前被调用：相关的 render 函数首次被调用
mounted	el 被新创建的 vm.$el 替换，并挂载到实例上去之后调用该钩子
beforeUpdate	组件数据更新之前调用，发生在虚拟 DOM 打补丁之前
updated	组件数据更新之后
activited	keep-alive 专属，组件被激活时调用
deactivated	keep-alive 专属，组件被销毁时调用
beforeDestory	组件销毁前调用
destoryed	组件销毁后调用