生命周期
定义
Vue 实例有一个完整的生命周期，也就是从开始创建、初始化数据、编译模版、挂载 Dom -> 渲染、更新 -> 渲染、卸载等一系列过程，我们称这是 Vue 的生命周期。
各个生命周期的作用
一般的组件，每一次加载都会有完整的生命周期，即生命周期里面对于的钩子函数都会被触发。
特殊情况：被keep-alive包裹的组件，却会多出两个生命周期的钩子:activated 与 deactivated。
额外的面试题
-
ajax请求应该放在哪个生命周期？
- ajax请求最好放在created里面，因为此时已经可以访问this了，请求到数据就可以直接放在data里面。
- created:在模板渲染成html前调用，即通常初始化某些属性值，然后再渲染成视图。 mounted:在模板渲染成html后调用，通常是初始化页面完成后，再对html的dom节点进行一些需要的操作。如果在mounted钩子函数中请求数据可能导致页面闪屏问题。
生命周期示意图
详细解析
- 在beforeCreate和created钩子函数之间的生命周期
在这个生命周期之间，进行初始化事件，进行数据的观测，可以看到在created的时候数据已经和data属性进行绑定（放在data中的属性当值发生改变的同时，视图也会改变）。 注意看下：此时还是没有el选项
- created钩子函数和beforeMount间的生命周期
首先会判断对象是否有el选项。如果有的话就继续向下编译，如果没有el选项，则停止编译，也就意味着停止了生命周期，直到在该vue实例上调用vm.$mount(el)。
el: '#app',
- beforeMount和mounted 钩子函数间的生命周期
此时是给vue实例对象添加$el成员，并且替换掉挂在的DOM元素。
- mounted
在mounted之前数据绑定还没有成功显示，只是通过{{xx}}进行占位的，因为此时还有挂在到页面上，还是JavaScript中的虚拟DOM形式存在的。在mounted之后可以看到页面中的内容发生了变化。
- beforeUpdate钩子函数和updated钩子函数间的生命周期
vue发现data中的数据发生了改变，会触发对应组件的重新渲染，先后调用beforeUpdate和updated钩子函数。 在beforeUpdate,可以监听到data的变化但是view层没有被重新渲染，view层的数据没有变化。等到updated的时候 view层才被重新渲染，数据更新。
- beforeDestroy和destroyed钩子函数间的生命周期
beforeDestroy钩子函数在实例销毁之前调用。在这一步，实例仍然完全可用。
destroyed钩子函数在Vue 实例销毁后调用。调用后，Vue 实例指示的所有东西都会解绑定，所有的事件监听器会被移除，所有的子实例也会被销毁。
