首先来回顾vue组件的生命周期
(官网截图)
**
其中vue3对比vue2有以下几点改变:
1、去掉了beforeCreate、created,直接使用setup
2、beforeDestroy、destroyed 被替换为了onBeforeUnmount、onUnmounted
另:新增了开发模式下:
onRenderTracked(组件渲染过程中追踪到响应式依赖时调用)、
onRenderTriggered(响应式依赖的变更触发了组件渲染时调用)
父子组件生命周期调用顺序
我们来通过在父子组件各个生命周期钩子中console.log来查看他们执行的顺序
(大家可自行试验)结论如下:
(以上为纯手写笔记,字略丑,见谅)
总结
先触发父组件,然后触发子组件,然后子组件先完成,最后父组件收尾
依据以上三对,可总结如下:
以上为父子组件生命周期调用顺序所总结的相关笔记,感谢双越老师!
感谢各位大佬的阅读!笔芯~