Vue生命周期详解

首先，什么是生命周期和生命周期函数
一个组件从创建、渲染最后到销毁的这个过程就是生命周期
在这之中发生的一些事件就是生命周期函数

初始化组件的事件和生命周期函数
↓
beforCreate：第一个生命周期函数，这时组件的data、methnds、和DOM结构都没有初始化，什么都做不了
↓
初始化data中的数据和methods里的方法
↓
created：这里data和methods里的方法已经可用了，但是页面还没有渲染出来。常用来请求数据
…
↓
beforeMount：当模板在内存中编译完成后，真正挂载到页面之前调用的生命周期函数，这时候我们看到的只是一个模板页面
↓
将内存中的模板替换到页面上
↓
mounted：页面挂载完成所执行的生命周期函数，此时页面就是完整的最终页面了。一些第三方插件如果需要初始化，必须在mounted中来进行
（至此就完成了组件的创建阶段，进入了运行阶段）
↓
（当data改变时触发）
beforeUpdate：此时data已经改变了，只是页面上现实的数据还没有更新
↓
updated：此时页面上的数据就已经更新了
（这就是组件的运行阶段，也就是更新数据）
↓
beforeDestroy：在这个生命周期函数里，组件即将被销毁，但是还未被销毁，还是可以正常使用的。
↓
destroyed：这里组件就已经销毁了，不能用了