生命周期的钩子函数

生命周期的钩子函数：组件整个生命周期里能被自动调用的函数，就是生命周期的钩子函数

挂载阶段钩子函数：（只会执行一次）

　　beforeCreate  最早执行

　　　　在实例初始化之后，数据观测 (data observer) 和 event/watcher 事件配置之前被调用。

　　　　不能访问数据   拿不到数据

　　created  常用  最早获取数据 (发Ajax请求用created)

　　　　在实例创建完成后被立即调用 可以获取数据

　　　　可以访问数据   经常用来发请求   访问不到真实的dom节点

　　beforeMount

　　　　在挂载开始之前被调用

　　　　可以访问数据  编译模板结束，虚拟dom已经存在   不能拿到节点

　　mounted  常用  可以拿到节点和数据

　　　　可以拿到节点和数据

　　　　实例被挂载后调用

　　补充：如何拿到节点：

　　　　ref表示节点

　　　　this.$refs.ref的标识 就可以拿到节点了

更新阶段钩子函数：（只要数据改变就会执行，只要执行了一定是数据已经改变了）

　　beforUpdata

　　　　数据更新时调用，发生在虚拟dom打补丁之前（数据变了，虚拟dom还没有改变这一部分之前，真实dom也还没有渲染呢）

　　updated  常用  监控数据的变化

　　　　数据更新时调用，发生在由于数据更改导致的虚拟dom重新渲染和打补丁之后

　　　　防止死循环（+=操作会引起死循环）

　　　　与watch之间的区别：watch是监控特定数据的变化　updated是监控组件里所有数据的变化

销毁阶段钩子函数：

　　beforeDestroy

　　　　实例销毁之前调用（组件卸载之前），实例仍然完全可用。  

　　　　清理资源，防止内存的泄露

　　destroyed 

　　　　实例销毁后调用（组件卸载之后），对应vue实例的所有指令都被解绑，所有的事件监听器被移除，所有的子实例也都被销毁。

　　补充：destroyed 被调用后 this.$destroy 可以销毁组件

keep-alive:

　　　　使用：<component :is="存储组件的名字的变量"></component>

　　　　activated 被keep-alive缓存的组件激活时调用

　　　　deactivated 被keep-alive缓存的组件停用时调用

　　　　如果没用keep-alive包裹component，那么一定会发生组件的卸载和挂载，如果包裹了，那么组件不会卸载（销毁），而会执行deactivated 

 

生命周期图示：https://cn.vuejs.org/images/lifecycle.png