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

相关推荐
yaoxin5211234 分钟前
397. Java 文件操作基础 - 创建常规文件与临时文件
java·开发语言·python
小短腿的代码世界8 分钟前
Qt日志系统深度解析:从qDebug到企业级日志框架
开发语言·qt
前端摸鱼匠29 分钟前
Vue 3 的v-bind合并行为:讲解v-bind与普通属性合并的规则
前端·javascript·vue.js·前端框架·ecmascript
REDcker1 小时前
浏览器端Web程序性能分析与优化实战 DevTools指标与工程清单
开发语言·前端·javascript·vue·ecmascript·php·js
我命由我123452 小时前
Kotlin 开发 - lateinit 关键字
android·java·开发语言·kotlin·android studio·android-studio·android runtime
Halo_tjn2 小时前
Java Set集合相关知识点
java·开发语言·算法
Linsk3 小时前
Java和JavaScript的关系真是雷峰和雷峰塔的关系吗?
java·javascript·oracle
当时只道寻常3 小时前
浏览器文本复制到剪贴板:企业级最佳实践
javascript
许彰午3 小时前
我手写了一个 Java 内存数据库(二):B+ 树的插入与分裂
java·开发语言·面试
大飞记Python3 小时前
【2026更新】Python基础学习指南(AI版)——04数据类型
开发语言·人工智能·python