Vue2和Vue3生命周期的对比

Vue2和Vue3生命周期的对比

  • [Vue2 和 Vue3 生命周期对照表](#Vue2 和 Vue3 生命周期对照表)
  • [Vue2 和 Vue3 生命周期图示](#Vue2 和 Vue3 生命周期图示)

Vue2 和 Vue3 生命周期对照表

|------------------|---------------|-------------------|
| 触发时机 | Vue2.x | Vue3.x |
| 组件创建时运行 | beforeCreate | setup |
| 组件创建时运行 | created | setup |
| 挂载在DOM时运行 | beforeMount | onBeforeMount |
| 挂载在DOM时运行 | mounted | onMounted |
| 响应数据修改时运行 | beforeUpdate | onBeforeUpdate |
| 响应数据修改时运行 | updated | onUpdated |
| 元素销毁前执行 | beforeDestroy | onBeforeUnmount |
| 元素销毁前执行 | destroyed | onUnmounted |
| 管理Keep-Alive组件 | activated | onActivated |
| 管理Keep-Alive组件 | deactivated | onDeactivated |
| Vue3 Debug Hooks | - | onRenderTriggered |
| Vue3 Debug Hooks | - | onRenderTracked |

Vue2 和 Vue3 生命周期图示

  1. Vue2 生命周期图

  2. Vue3 生命周期图

相关推荐
十六年开源服务商3 分钟前
家庭装修公司网站方案策划2026
java·开发语言
Mr_Xuhhh6 分钟前
深入理解Java高级特性:反射、枚举与Lambda表达式实战指南
开发语言·python
XiYang-DING8 分钟前
【Java】TOP-K问题
java·开发语言
枫叶丹410 分钟前
【HarmonyOS 6.0】Navigation组件新特性
开发语言·华为·harmonyos
格林威13 分钟前
GigE Vision 多相机同步终极检查清单(可直接用于项目部署)
开发语言·人工智能·数码相机·机器学习·计算机视觉·视觉检测·工业相机
xinzheng新政17 分钟前
Javascript·深入学习基础知识2
开发语言·javascript·学习
萝卜白菜。43 分钟前
TongWeb8.0 JNDI缓存
开发语言·python·缓存
XMYX-01 小时前
03 - Go 常用类型速查表 + 实战建议(实战向)
开发语言·golang
爱码驱动1 小时前
Java多线程详解(5)
java·开发语言·多线程
之歆1 小时前
Composition API 深度解析 - 重新理解 Vue 的组件化编程
前端·javascript·vue.js