Vue的生命周期

下面是Vue官网对生命周期的介绍

Vue是一个构造函数，在这个构造函数执行的过程中会经历开始创建、初始化数据、编译模板、实例挂载到真实的DOM、数据渲染 ----> 视图更新等一系列过程，而在这个过程中会在特定的阶段默认调用一些函数，这些函数就是Vue生命周期的钩子函数。

下面对这些钩子函数进行详细说明：

1、实例通过new Vue（）创建后，就会初始化事件和生命周期，然后就会调用beforeCreate函数，此时数据还没有挂载，还无法访问数据和DOM元素。
2、挂载数据，绑定事件等，实例创建完成，此时调用created函数，这个时候可以访问Vue中的数据了，也可以进行更改。
3、下面开始找实例对应的模板，编译模板为虚拟DOM放入到render函数中准备渲染，在渲染之前调用beforeMount钩子函数，在这个函数中虚拟DOM已经创建完成，马上就要渲染，在这里还可以更改数据，不会触发updated函数，这里也是在渲染前最后一次更改数据而不会触发其他钩子函数的机会。
4、接下来开始编译，渲染出真实DOM，渲染完成后调用mounted钩子函数，此时所有的组件都已经显示在页面中，数据、真实的DOM都已经处理完成，事件也已经挂载完成，可以在这里获取真实的DOM进行操作。
5、当实例中的数据更改后，会立即执行beforeUpdate，（在这个时候视图还没有进行更新），然后vue的虚拟DOM机制会重新构建虚拟DOM与上一次的虚拟DOM利用diff算法进行对比后，进行重新渲染。
6、当更新完成后，执行updated钩子函数，此时数据和视图都已经更新完成。
7、当调用了 $destroy 方法后，会立即触发 beforeDestroy 钩子函数，此时Vue实例还没有被销毁，一般在这里做一些善后工作，例如清除定时器…
8、在 $destroy 调用后会进行卸除组件，接触数据监听等操作，一切操作完成后，Vue实例被销毁，只剩下DOM空壳。

注释：
beforecreate、created、beforeMount、mounted这四个钩子函数只会在Vue实例初始化过程中
按照先后顺序执行，之后无论数据视图发生什么改变都不会再执行

在beforeUpdate和updated中不能更新数据，否则会陷入死循环