vue.js生命周期

• 在初始化阶段，也就是通过new Vue创建实例到created生命周期函数执行之后的这段时间里，首先初始化属性与事件，然后通过callback函数触发生命周期钩子beforecreate,随后初始化provide/inject和状态。状态指的是props,methods,data,computed,watch。接着触发生命周期钩子created。
• 在模板编译阶段，也就是created之后，beforeMount之前的这段时间里，判断用户是否在参数中提供了el选项，如果提供了，就自动开启模板编译与挂载阶段。如果没有el选项，则需要执行vm.$ mount方法，手动开启模板编译阶段。最后，将模板编译为渲染函数。接着会触发生命周期钩子beforeMount。
• 在挂载过程中，实例会被挂载到DOM元素上，也就是将模板渲染到指定的DOM元素中。挂载完成后，会触发生命周期钩子mounted。vuejs会开启watcher来持续追踪依赖变化。
  在已挂载的状态下，vuejs会持续追踪状态的变化，当状态发生改变时，watcher会通知虚拟DOM重新渲染视图，并在渲染视图之前触发beforeUpdate钩子函数，渲染完毕后，触发updated钩子函数。
• 在卸载之前，会触发生命周期钩子beforeDestory。当实例上的$destory()方法被调用时，会卸载追踪依赖，子组件和事件监听器。卸载完成后会触发生命周期钩子destoryed。

（1）初始化阶段的原理

• 初始化实例属性
  需要实例化的属性有vue.js内部需要的属性（如vm._watcher）,也有提供给外部使用的属性（vm.
  $$parent,vm.$
  $root,vm.$
  $refs）
  Vue.js通过initLifecycle函数向实例中挂载属性，该函数接收vue.js实例作为参数。只需要向vue.js实例设置属性即可向vue.js实例挂载属性。
• 初始化事件
  是指将父组件在模板中使用的v-on注册的事件添加到子组件的事件系统中。
  V-on如果写在组件标签上，那么这个事件会注册到子组件事件系统中；如果是写在平台标签上，事件会被注册到浏览器事件中。
• 初始化inject
  Inject和provide允许祖先向其所有子孙后代注入依赖。
• 初始化状态
  用户在实例化vue.js时使用了哪些状态，哪些状态就要被初始化。没有用到的状态不用初始化。初始化顺序：props,methods,data,computed,watch。先props后data，这样可以在data中使用props。Watch最后初始化，所以既可以观察props，也可以观察data。