Vue父子组件生命周期执行顺序
vue2 中 执行顺序 ：
beforeCreate = created = beforeMount = mounted = beforeUpdate = updated = beforeDestroy = destroyed
vue3 中 执行顺序 setup = onBeforeMount = onMounted = onBeforeUpdate = onUpdated = onBeforeUnmount = onUnmounted
对应关系
vue2 - vue3
执尺纳激行顺序为：
父beforeCreate =陵袜 父created = 父beforeMount = 子beforeCreate = 子created = 子beforeMount = 子mounted = 父mounted
执行顺序为：
父beforeUpdate = 子beforeUpdate = 子updated = 父updated
执行顺序为：
父beforeDestroy =茄粗 子beforeDestroy = 子destroyed = 父destroyed
规律就是：父组件先开始执行，然后等到子组件执行完，父组件收尾。
react父子组件生命周期执行顺序
React的生命周期从广义上分为三个阶段：挂载、渲染、卸载，因此可以把React的生命周期分为两类：挂载卸载过程和更新过程。
一、挂载卸载过程
1.constructor，完成了React数据的初始化；
2.componentWillMount，组件初始化数据后，但是还未渲染DOM前；
3.componentDidMount，组件第一次渲染完成，此时dom节点已经生成；
4.componentWillUnmount，组件的卸载和数据的销毁。
二、更新过程
1.componentWillReceiveProps (nextProps)，父组件改变后的props需要重新渲染组件时；
2.shouldComponentUpdate(nextProps,nextState)，主要用于性能优化(部分更新)，因为react父组件的重新渲染会导致其所有子组件的重新渲染，这个时候其实我们是不需要所有子组件都跟着重新渲染的，在这里return false可以阻止组件的更新穗弯余；
3.componentWillUpdate (nextProps,nextState)，shouldComponentUpdate返回true后，组件进入重新渲染的流程；
4.componentDidUpdate(prevProps,prevState)，组件更新完毕后触发；
5.render()，渲染时触发。
三、父子组件加载顺序
观察父子组件的挂载生命周期函数，可以发现挂载时，子组件的挂载钩子先被触发猜滚；卸载时，子组件的卸载钩子后被触发。
我们经常在挂载函数上注册监听器，说明此时是可以与页面交互的，也就是说其实所有挂载钩子都是在父组件实际挂载到dom树上才触发的，不过是在父组件挂载后依次触发子组件的 componentDidmount ，最后再触发自身的挂载钩子，说白了，componentDidMount 其实是异步钩子。
相反，卸载的时候父节点先被移除，再从上至下依次触发子组闹镇件的卸载钩子；
但是我们也经常在卸载钩子上卸载监听器，这说明 componentWillUnmount 其实在父组件从dom树上卸载前触发的，先触发自身的卸载钩子，但此时并未从dom树上剥离，然后依次尝试触发所有子组件的卸载钩子，最后，父组件从dom树上完成实际卸载。
Vue中父子组件生命周期的执行顺序
同步引入时生命拆首周期顺序为：
父组件的beforeCreate、created、beforeMount -- 所有子组件的beforeCreate、created、beforeMount -- 所有子组件的mounted -- 父组件的mounted
总结：父组件先创建，然后子组蔽御告件创建；子组件先挂载，然后父组件挂载
若有孙组件呢？
父组件先beforeCreate = created = beforeMount , 然后子组件开始beforeCreate = created = beforeMount ，然后孙组件beforeCreate = created = beforeMount = mounted，孙组件挂载完成了，子组件mounted，父组件再mounted
异步引入时生宏明命周期顺序为：
父组件的beforeCreate、created、beforeMount、mounted -- 子组件的beforeCreate、created、beforeMount、mounted
总结：父组件创建，父组件挂载；子组件创建，子组件挂载。
3.父组件更新过程
父beforeUpdate-父updated
4.销毁过程
父beforeDestroy-子beforeDestroy-子destroyed-父destroyed
原文：
以上内容为新媒号(sinv.com.cn)为大家提供！新媒号，坚持更新大家所需的前端知识。希望您喜欢！
版权申明：新媒号所有作品（图文、音视频）均由用户自行上传分享，仅供网友学习交流，不声明或保证其内容的正确性，如发现本站有涉嫌抄袭侵权/违法违规的内容。请发送邮件至 k2#88.com(替换@) 举报，一经查实，本站将立刻删除。
