vue项目是由一个一个小的组件堆积形成的组件树，在这个组件树中，每个组件都是一个vue实例，都有其自身的一个构建的过程，我们成这个过程是组件的生命周期。

生命周期

过程：

1. new vue(): 这相当代码中执行了new vue({})操作；

2. init（event&lifecycle）：在这个过程中，只初始化了空的vue实例，在这个实例上目前只有声明周期函数和原型事件。

3. beforecreate(): 在实例初始化之后，数据观测（data observer）和event/watcher事件配置之前调用，即此时的vue对象虽然被创建了，但是vue对象的属性data和computed等还没有绑定，所以在这里引用data跟computed里面的属性应该是会报错的。

4. 挂载数据（绑定属性）：这里阶段vue对象的属性，包括computed计算属性也运算后绑定了；

5. created钩子函数：这时候vue对象中的data和computed属性都已经绑定了，但是DOM还没有生成，$el属性还没有存在。 即data已经赋值了，computed已经运算完了，但是没有动态创建template属性对应的HTML元素，如果这个时候改变data中的数据不会触发updata函数。 这里不要对dom节点操作，这里通过id去找dom点是找不到的。
   但是因为这时候data中已经有数据，从created开始往后可以使用data中的数据想后台做请求，但是不会触发updata钩子。

6. 检查：
   1）检查是否有el属性，检查vue配置，即new Vue{}里面的el项是否存在，有就继续检查template项。没有则等到手动绑定调用vm.$mount()，完成了全局变量$el的绑定。
   2）检查是否有template属性，检查vue配置中的template选项是否有模板来填充被绑定的区域，即el属性中指定的div，如果有render属性，那么render就会替换template，在优先级上：render>template>el；
   如果没有template属性，则将el属性指定的div外层的元素作为template编译。

7. beforeMount 钩子函数：模板编译，数据挂载之前的函数，数据还没有挂载到页面上，{{}}里面的变量还没有替换。

8.模板编译：vm.$el替换#el；vue对象中的数据（属性）替换template中的内容，这时给相当模板中的变量赋值了。

9. mounted 钩子函数：此时模板编译完成了，数据挂载到了页面上，即{{}}中的数据已经正常显示了。
   一般这里可以做一些初始化的操作，像服务器请求数据，显示在dom里。这时候可以根据id等方式拿到dom点，这时候页面已经挂载，dom中的变量已经赋值了，所以这时候可以通过getElementById等方式去操作dom。

10. beforeUpdate钩子函数： 当模板中的数据更新时触发，但是在组件更新前，即函数虽然触发，但是数据还没有在dom上更新。

11. updated 钩子函数： 当模板中的数据更新后，已经在dom点上重新渲染后触发。

12. activated函数：keep-alive组件激活时调用

13. deactivated函数：keep-alive组件停用时调用

14. beforeDestroy：vue（组件）对象销毁之前

15. destroyed：vue组件销毁后