开启掘金成长之旅！这是我参与「掘金日新计划 · 12 月更文挑战」的第12天，点击查看活动详情

vue3 在生命周期上略有调整，除了一些名字上的微调，基本流程是没有什么变化的，也就是说如果三方库兼容应该也是很容易的。

但是为什么感觉vue3的生态还是一直不行呢。我觉得根本原因就是，vue3这次新增的composition api实在很吸引人，所以很多三方选择了重构！这反而说明vue3很成功了

我们先看一下vue3官网的图片，然后捡一些重要的生命周期说一下

setup

从图中可以看出来，组件渲染的第一步就是setup，也就是vue3新增的composition api，在这个生命周期里，组件内数据，dom都是无法访问的，甚至组件的this也不存在，但是恰恰如此，反而更有灵活性。

我们可以在这里请求接口，通过ref或者reactive来存储返回值，当然渲染界面的时候可以更加提前

我们已经可以提前声明一些变量，方法，并将它封装成函数去使用。

简单的来说，这个生命周期可以提前后期全部的生命周期

created

created在vue2与vue3中都有，它的含义其实是组件初始化完成，包括组件的选项，data，props,events这些都准备好了，但仅是准备好了，并没有执行。

从这个生命周期里,我们可以访问data，但还是没有dom

这个周期表示，dom已经建立完成了，也表示组件的第一次渲染，如果没出错，组件应该展示了。

这里面可以访问你的dom了，比如$refs,document.getElementById等等，这时候你也可以使用一些关于dom的三方库了，比如swiper

这个周期表示你的组件里数据发生了变化，应该要重新渲染了，这个周期其实并不常用，但是咱们一定要知道。

这两个周期表示着组件的销毁，但要注意的是不是所有情况组件组件都会销毁，当你切换路由或者v-if的时候，组件才会销毁。

这个周期里我们可以回收一些变量，取消一些定时器，减少内存泄漏的风险