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

相关推荐
Liuqy-054 小时前
线程的互斥与同步机制——互斥锁、条件变量、无名信号量
linux·开发语言·线程·进程·条件变量·同步·互斥
geats人山人海4 小时前
java 7异常
android·java·开发语言
keyipatience4 小时前
JS学习笔记(2)数组,函数,作用域,对象
前端·javascript·笔记·学习·html
donk13144 小时前
React Native for OpenHarmony 实战:三方库 react-native-segmented-control-tab 的鸿蒙化适配指南
javascript·react native·react.js·华为·harmonyos
Pniubi4 小时前
分片的意义?
java·开发语言
Geoffwo5 小时前
robotjs0.6.0鼠标中轴滚动失效修复方案
前端·javascript
阿皮 API5 小时前
Shopee虾皮商品详情API接口调用实战:Python获取东南亚商品数据与JSON解析
开发语言·python·json
niucloud-admin5 小时前
NIUCLOUD LITE AI开发文档--系统部署
开发语言·ai
多弗朗皮卡丘5 小时前
C++异常
开发语言·c++·异常
米糕闯编程5 小时前
鱼香ros2(十七)C++小海龟巡逻
开发语言·c++·机器人·ros2·服务·小海龟