07月08, 2022

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

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

  1. ⽗⼦组件初始化时 ⽣命周期的执⾏顺序 ⽗beforeCreate -> ⽗created -> ⽗beforeMount -> ⼦beforeCreate -> ⼦created -> ⼦beforeMount -> ⼦mounted->⽗mounted
  2. ⽗⼦组件数据更新时 ⽣命周期的执⾏顺序 ⽗beforeUpdate -> ⼦beforeUpdate -> ⼦updated -> ⽗updated
  3. ⽗⼦组件销毁时 ⽣命周期的执⾏顺序 ⽗beforeDestroy -> ⼦beforeDestroy -> ⼦destroyed -> ⽗destroyed
  4. 同时引入多个子组件 同步引入 import Page from '@/components/page' 父组件的beforeCreate、created、beforeMount --> 所有子组件的beforeCreate、created、beforeMount --> 所有子组件的mounted --> 父组件的mounted 异步引入 const Page = () => import('@/components/page') 父组件的beforeCreate、created、beforeMount、mounted --> 子组件挨个的beforeCreate、created、beforeMount、mounted

本文链接:http://zzl.bzpwhite.cn/post/vue-fu-zi-zu-jian-sheng-ming-zhou-qi-zhi-xing-shun-xu.html

-- EOF --

Comments