首页/ 学科题库/ vue/ 父子组件生命周期顺序
vue 实战教程

父子组件生命周期顺序

2026-05-20 约 6 分钟 juanwangdev

父子组件生命周期顺序

理解父子组件生命周期顺序对调试和开发很重要。

挂载顺序

text
父 beforeCreate
父 created
父 beforeMount
子 beforeCreate
子 created
子 beforeMount
子 mounted
父 mounted

外层组件先创建,内层组件先挂载。

更新顺序

text
父 beforeUpdate
子 beforeUpdate
子 updated
父 updated

父组件先触发 beforeUpdate,子组件先完成 updated。

卸载顺序

text
父 beforeUnmount
子 beforeUnmount
子 unmounted
父 unmounted

与挂载相反,子组件先卸载。

图示

text
创建: 父 → 子
挂载: 子 → 父
更新: 父 before → 子 before → 子 after → 父 after
卸载: 父 before → 子 before → 子 after → 父 after

子组件的 mounted 在父组件 mounted 之前执行。

要点总结

  • 创建:父先子后
  • 挂载:子先父后
  • 更新:父 before 先,子 after 先
  • 卸载:父 before 先,子 after 先
  • 理解顺序有助于正确编写组件交互逻辑
想在手机上练这篇的配套题目?
使用微信 卷王开发者小程序/App,首页顶部扫一扫识别下方二维码,即可解锁本讲对应真题与错题本。
了解产品 App
← 上一篇 errorCaptured 下一篇 → 混入Mixin