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 生命周期图

相关推荐
忆~遂愿8 分钟前
GE 引擎进阶:依赖图的原子性管理与异构算子协作调度
java·开发语言·人工智能
沐知全栈开发13 分钟前
API 类别 - 交互
开发语言
人道领域33 分钟前
SSM框架从入门到入土(AOP面向切面编程)
java·开发语言
铅笔侠_小龙虾34 分钟前
Flutter 实战: 计算器
开发语言·javascript·flutter
2的n次方_1 小时前
Runtime 执行提交机制:NPU 硬件队列的管理与任务原子化下发
c语言·开发语言
大模型玩家七七1 小时前
梯度累积真的省显存吗?它换走的是什么成本
java·javascript·数据库·人工智能·深度学习
2501_944711431 小时前
JS 对象遍历全解析
开发语言·前端·javascript
凡人叶枫2 小时前
C++中智能指针详解(Linux实战版)| 彻底解决内存泄漏,新手也能吃透
java·linux·c语言·开发语言·c++·嵌入式开发
Tony Bai2 小时前
再见,丑陋的 container/heap!Go 泛型堆 heap/v2 提案解析
开发语言·后端·golang
发现一只大呆瓜2 小时前
虚拟列表:支持“向上加载”的历史消息(Vue 3 & React 双版本)
前端·javascript·面试