简述Vue的生命周期以及每个阶段做的事
思路
- 给出定义或概念
- 列举生命周期各阶段
- 阐述整体流程
- 拓展:vue3变化
定义
每个 Vue 组件实例在创建时都需要经历一系列的初始化步骤，比如设置好数据侦听，编译模板，挂载实例到 DOM，以及在数据改变时更新 DOM。在此过程中，它也会运行被称为生命周期钩子的函数，让开发者有机会在特定阶段运行自己的代码。
Vue⽣命周期总共可以分为8个阶段：创建前后,载⼊前后,更新前后,销毁前后，以及⼀些特殊场景的⽣命周期。vue3中新增了三个⽤于调试和服务端渲染场景。
列举生命周期各阶段及vue2与vue3的区别
| 生命周期v2 | 生命周期v3 | 描述 |
|---|---|---|
| beforeCreate | setup | 组件实例被创建之初 |
| created | setup | 组件实例已经完全创建 |
| beforeMount | onBeforeMount | 组件挂载之前 |
| mounted | onMounted | 组件挂载到实例上去之后 |
| beforeUpdate | onBeforeUpdate | 组件数据发⽣变化，更新之前 |
| updated | onUpdated | 数据数据更新之后 |
| beforeDestroy | onBeforeUnmount | 组件实例销毁之前 |
| destroyed | onUnmounted | 组件实例销毁之后 |
| activated | activated | keep-alive缓存的组件激活时 |
| deactivated | deactivated | keep-alive缓存的组件激活时 |
| errorCaptured | errorCaptured | keep-alive缓存的组件激活时 |
| - | renderTracked | 调试钩⼦，响应式依赖被触发时调⽤ |
| - | renderTriggered | 调试钩⼦，响应式依赖被触发时调⽤ |
| - | serverPrefetch | ssr only，组件实例在服务器上被渲染前调⽤ |
