vue的生命周期钩子函数

vue的生命周期

Vue实例有一个完整的生命周期，也就是从开始创建、初始化数据、编译模板、挂载Dom、渲染→更新→渲染、卸载等一系列过程，我们称这是Vue的生命周期。通俗说就是Vue实例从创建到销毁的过程，就是生命周期。

DOM操作

 mounted

数据修改

 beforeMount created mounted

---

beforeCreate

el 和 data 并未初始化
此时data、watcher、methods统统滴没有。

created

data选项中的数据能获取到
但是取不到真实的DOM
数据观测(data observer) ，属性和方法的运算
此时 this.$data 可以访问，watcher、events、methods也出现了，若根据后台接口动态改变data和methods的场景下，可以使用。
可以在这个钩子函数里发请求，访问后端接口拿数据，完成数据的初始化

beforeMount

完成了 el 和 data 初始化

mounted

完成挂载

beforeUpdate

$vm.data更新之后，虚拟DOM重新渲染和打补丁之前被调用。你可以在这个钩子中进一步地修改$vm.data，这不会触发附加的重渲染过程。

updated

虚拟DOM重新渲染 和打补丁之后被调用。
当这个钩子被调用时，组件DOM的data已经更新，所以你现在可以执行依赖于DOM的操作。但是不要在此时修改data，否则会继续触发beforeUpdate、updated这两个生命周期，进入死循环！

vue渲染template的时间在beforeMount之后，mounted之前，

钩子函数的应用

beforecreate : 举个栗子：可以在这加个loading事件
created：在这结束loading，还做一些初始化，实现函数自执行 mounted ： 在这发起后端请求，拿回数据，配合路由钩子做一些事情

参考
Vue 生命周期钩子函数实例详解

Vue之生命周期的8个钩子函数
个人理解的VueJS生命周期以及其中钩子函数的实际应用