vue3父子组件生命周期执行顺序

🔹 Vue 3 父子组件生命周期执行顺序

Vue 3 生命周期名称部分不同(beforeDestroy→beforeUnmount,destroyed→unmounted),顺序也有微调。

创建和挂载阶段

  1. 父 setup(在 beforeCreate/created 前统一)

  2. 父 beforeCreate(逻辑在 setup 内已经替代)

  3. 父 created

  4. 父 beforeMount

  5. 子 setup

  6. 子 beforeCreate / created

  7. 子 beforeMount

  8. 子 mounted

  9. 父 mounted

(区别:Vue3 的 setup 在 beforeCreate/created 之前执行,父 setup 在子 setup 之前)

更新阶段

  • 父组件更新时:

    1. 父 beforeUpdate

    2. 子 beforeUpdate

    3. 子 updated

    4. 父 updated

(和 Vue2 相同)

卸载阶段

  1. 父 beforeUnmount

  2. 子 beforeUnmount

  3. 子 unmounted

  4. 父 unmounted


📋 对比总结

 

 

 

 

个人笔记记录 2021 ~ 2025