vue—生命周期

vue生命周期的理解：
vue生命周期是指vue实例对象从创建之初到销毁的过程。
vue的生命周期总共分为8个阶段：创建前/后，载入前/后，更新前/后，销毁前/后
vue生命周期的作用：生命周期中有多个钩子，可以让我们在控制整个vue实例时更容易形成好的逻辑

1、创建前/后：
beforeCreate ：在实例初始化之后，数据观测 (data observer) 和 event/watcher 事件配置之前被调用。
（实例被创建之前的函数）阶段，vue实例挂载元素el和数据对象data都是undefined，还未初始化

created：数据data已经初始化完成，方法也已经可以调用，但是DOM为渲染。在这个周期里面如果进行请求是可以改变数据并渲染，由于DOM未挂载，请求过多或者占用时间过长会导致页面线上空白

2、载入前/后：
beforeMount：DOM未完成挂载，数据也初始化完成，但是数据的双向绑定还是显示{{}}，这是因为Vue采用了Virtual DOM（虚拟Dom）技术。先占住了一个坑

mounted：数据和DOM都完成挂载，在上一个周期占位的数据把值给渲染进去。一般请求会放在这个地方，因为这边请求改变数据之后刚好能渲染

3、更新前/后：
beforeUpdate：只要是页面数据改变了都会触发，数据更新之前，页面数据还是原来的数据，当你请求赋值一个数据的时候会执行这个周期，如果没有数据改变不执行

updated：只要是页面数据改变了都会触发，数据更新完毕，页面的数据是更新完成的。beforeUpdate和updated要谨慎使用，因为页面更新数据的时候都会触发，在这里操作数据很影响性能和容易死循环

4、activated：keep-alive 组件激活时调用
deactivated：keep-alive 组件停用时调用

5、销毁前/后：
beforeDestroy：实例销毁之前调用
这个周期是在组件销毁之前执行，在我项目开发中，觉得这个其实有点类似路由钩子beforeRouterLeave,都是在路由离开的时候执行，只不过beforeDestroy无法阻止路由跳转，但是可以做一些路由离开的时候操作，因为这个周期里面还可以使用data和method。比如一个倒计时组件，如果在路由跳转的时候没有清除，这个定时器还是在的，这时候就可以在这个里面清除计时器

destroyed：Vue 实例销毁后调用。调用后，Vue 实例指示的所有东西都会解绑定，所有的事件监听器会被移除，所有的子实例也会被销毁

在生命周期钩子函数中父子执行顺序：

beforeMount–执行顺序是先父后子

mounted–执行顺序是先子后父

beforeDestroy–执行顺序是先父后子

destroyed—执行顺序是先子后父

第一次页面加载会触发那几个钩子？
beforeCreate created beforeMount mounted

keep-alive的生命周期-重要！

1.activated：来缓存组件状态，页面第一次进入的时候，钩子触发的顺序是created->mounted->activated，之后再进入页面的时候，不会触发created，只会触发activated，也就是activated在这时代替了created。

2.deactivated ：页面退出的时候会触发deactivated，当再次前进或者后退的时候只触发activated