官网生命周期图：
vue有8种生命周期函数：
| 钩子函数 | 触发的行为 | 在此阶段可以做的事情 |
|---|---|---|
| beforeCreadted | vue实例的挂载元素$el和数据对象data都为undefined，还未初始化。 | 加loading事件 |
| created | vue实例的数据对象data有了，但是DOM还未生成，$el还没有 | 结束loading、请求数据为mounted渲染做准备 |
| beforeMount | vue实例的$el和data都初始化了，但还是虚拟的dom节点，具体的data.filter还未替换。 | |
| mounted | vue实例挂载完成，data.filter成功渲染 | 配合路由钩子使用 |
| beforeUpdate | data更新时触发 | |
| updated | data更新时触发 |
数据更新时，做一些处理 （此处也可以用watch进行观测） |
| beforeDestroy | 组件销毁时触发 | |
| destroy | 组件销毁时触发，vue实例解除了事件监听以及和dom的绑定（无响应了），但DOM节点依旧存在 | 组件销毁时进行提示 |
组件套用时生命周期：
1. 先执行父组件的created和beforeMounted函数；
2.再按子组件的使用顺序，执行子组件的created和beforeMounted函数；
3.依旧按照子组件的执行顺序执行mounted函数，最后是父组件的mounted函数；
也就是说父组件准备要挂载还没挂载的时候，子组件先完成挂载，最后父组件再挂载；所以在真正整个大组件挂载完成之前，内部的子组件和父组件之间的数据是可以相互传递的，可获取并使用
场景
- beforecreate : 可以在这加个loading事件
- created ：在这结束loading，进行ajax请求异步数据的获取、初始化数据
- mounted ： 挂载元素dom节点的获取（eg：echarts初始化）
- updated：任何数据的更新，如果要做统一的业务逻辑处理
- beforeDestroy： 你确认删除XX吗？
- destroyed ：当前组件已被删除，清空相关内容
- （好像接下来混入了其他奇怪的东西）
- nextTick：针对单一事件更新数据后立即操作dom
- watch：监听数据变化，并做相应的处理