Vue生命周期

1. beforeCreate:

new Vue()  新建vue实例，初始化类和实例挂载功能，执行时组件实例还未创建，通常用于插件开发中执行一些初始化任务。

2. created:

data，props，methods，computed => 把vue的配置合并到新建的实例上，数据操作和属性合并 => 不涉及到vdom和dom的方法处理，组件初始化完毕，各种数据可以使用，常用于异步数据获取。

3. beforeMount:

vDom，虚拟dom生成了，利用数据结构生成的虚拟dom，可以进行数据操作 => 不可以涉及dom操作，未执行渲染、更新，dom未创建。

4. mounted:

Dom已生成，可以进行几乎所有操作，如绘制图表，获取 $refs。初始化结束，dom已创建，可用于获取访问数据和dom元素。

5. beforeUpdate:

vDom更新了，获取到的数据，未触发render函数，这时候获取节点信息是旧的，数据是新的。更新前，可用于获取更新前各种状态。

6. updated:

dom更新了，更新后，所有状态已是最新。

谨慎在beforeUpdate 和 updated 里操作dom，布局的操作很可能会造成数据的改变，形成死循环

视图变化需要触发数据的改变可能会用到update生命周期

7. beforeDestory：

vDom销毁前，可用于一些定时器或订阅的取消。

8. destroyed：

实例销毁后，组件已销毁，可用于一些定时器或订阅的取消。

vue3对生命周期的改变：

beforeCreate & created => 改成了 setup

beforeDestory => 改成了 beforeUnmount

destroyed => 改成了 unmounted

---

数据请求在created和mounted的区别

created 是在组件实例一旦创建完成的时候立刻调用，这时候页面的dom节点并未生成；

mounted 是在页面dom节点渲染完毕之后就立刻执行的。

触发时机上 created 是比 mounted更早的，放在mounted中的请求有可能导致页面闪动，因为此时dom结构已经生成，但如果放在页面加载之前完成请求，则不会出现此情况。因此对页面内容的改动放在created生命周期中。

相同点：都能拿到实例对象的属性和方法。