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

相关推荐
qq_340040885 分钟前
idea2021版,vue项目的package.json不展示scripts的绿色箭头
javascript·vue.js·json
2601_9689007721 分钟前
玻璃深加工的工艺窗口:4 道工序的温度与时间参数边界
android·java·javascript
程序员大阳30 分钟前
副队长JavaScript教程(53)-DOM操作元素的属性
javascript·dom·属性·setattribute·getattribuite
超级架构师1 小时前
让 COBOL 长出 AI 大脑:原生 Agent 核心框架 praxo-core 深度剖析
c语言·开发语言·c++·人工智能·python·架构·ai编程
Non-existent9871 小时前
在 WPS/Excel 里做地理数据处理:功能市场 + 奥维 / Google Earth / QGIS 三种跳转实战
开发语言·javascript·ecmascript
zhougl9961 小时前
什么是 URL
javascript
xiaolang_8616_wjl1 小时前
c++游戏_宝可梦大世界(源代码)
开发语言·c++·游戏
Leinwin2 小时前
Copilot Studio 实战:多模型选择、GitHub Copilot harness 计费与 Copilot Credits 额度管理
开发语言·c#
余额瞒着我当琳2 小时前
C++异常,异常的概念,异常抛出与捕获,RAII 和智能指针的设计思路,C++标准库一些指针的使用
java·开发语言·c++·算法