挂载阶段
执行顺序为:
父beforeCreate -> 父created -> 父beforeMount -> 子beforeCreate -> 子created -> 子beforeMount -> 子mounted -> 父mounted
更新阶段
执行顺序为:
父beforeUpdate -> 子beforeUpdate -> 子updated -> 父updated
销毁阶段
执行顺序为:
父beforeDestroy -> 子beforeDestroy -> 子destroyed -> 父destroyed
规律:父组件先开始执行,然后等到子组件执行完,父组件收尾。
举例
一.单组件和父子组件的相爱相杀
1.1 从单组件进入到父子组件(此处忽略更新操作且无缓存)
父beforeCreate -> 父created -> 父beforeMount -> 子beforeCreate -> 子created -> 子beforeMount ->单组件beforeDestroy->单组件Destroyed-> 子mounted -> 父mounted
1.2 从单组件第一次进入到父子组件(此处忽略更新操作且父子组件开启缓存)
父beforeCreate -> 父created -> 父beforeMount -> 子beforeCreate -> 子created -> 子beforeMount ->单组件beforeDestroy->单组件Destroyed-> 子mounted -> 父mounted->子缓存激活->父缓存激活
1.3 从父子组件进入单组件(此处忽略更新操作且无缓存)
单组件beforeCreate -> 单组件created -> 单组件beforeMount->父beforeDestroy->子beforeDestroy->子Destroyed->父Destroyed->单组件mounted
1.4 从父子组件返回单组件(此处忽略更新操作且父子组件开启缓存)
单组件beforeCreate -> 单组件created -> 单组件beforeMount->单组件mounted->子缓存失活->父缓存失活
二.一父两子一孙组件和上中下组件的相爱相杀(此处孙为two子的子)
2.1 从一父两子一孙组件进入到上中下组件(此处忽略更新操作且无缓存)
上beforeCreate -> 上created -> 上beforeMount -> 中beforeCreate -> 中created -> 中beforeMount -> 下beforeCreate -> 下created -> 下beforeMount->父beforeDestroy->one子beforeDestroy->one子Destroyed->two子beforeDestroy->孙beforeDestroy->two子Destroyed->父Destroyed->上mounted->中mounted->下mounted
2.2 从一父两子一孙组件进入到上中下组件(此处忽略更新操作且上中下组件开启缓存第一次进入)
上beforeCreate -> 上created -> 上beforeMount -> 中beforeCreate -> 中created -> 中beforeMount -> 下beforeCreate -> 下created -> 下beforeMount->父beforeDestroy->one子beforeDestroy->one子Destroyed->two子beforeDestroy->孙beforeDestroy->two子Destroyed->父Destroyed->上mounted->中mounted->下mounted->上激活缓存->中激活缓存->下激活缓存
2.3 从一父两子一孙组件进入到上中下组件(此处忽略更新操作且都开启缓存多次进入)
one子失活缓存->孙失活缓存->two子失活缓存->父失活缓存->上激活缓存->中激活缓存->下激活缓存
2.4 从上中下组件进入到一父两子一孙组件(此处忽略更新操作且无缓存)
父beforeCreate -> 父created -> 父beforeMount->one子beforeCreate->one子created ->one子beforeMount->two子beforeCreate->two子created->two子beforeMount->孙beforeCreate->孙created->孙beforeMount->上beforeDestroy->上Destroyed->中beforeDestroy->中Destroyed->下beforeDestroy->下Destroyed->one子mounted->孙mounted->two子mounted->父mounted
2.5 从上中下组件进入到一父两子一孙组件(此处忽略更新操作且一父两子一孙开启缓存第一次进入)
父beforeCreate -> 父created -> 父beforeMount->one子beforeCreate->one子created ->one子beforeMount->two子beforeCreate->two子created->two子beforeMount->孙beforeCreate->孙created->孙beforeMount->上beforeDestroy->上Destroyed->中beforeDestroy->中Destroyed->下beforeDestroy->下Destroyed->one子mounted->孙mounted->two子mounted->父mounted->one子激活缓存-孙激活缓存->two子激活缓存->父激活缓存
2.6 从上中下组件进入到一父两子一孙组件(此处忽略更新操作且都开启缓存多次进入)
上失活缓存->中失活缓存->下失活缓存->one子激活缓存->孙激活缓存->two子激活缓存-父激活缓存