前端vue2父子组件的生命周期执行顺序
时间: 2024-03-16 10:40:02 浏览: 72
20.(vue3.x+vite)Vue子组件和父组件执行顺序.rar
在Vue2中,父子组件的生命周期执行顺序如下:
1. 父组件的生命周期:
- beforeCreate:在实例初始化之后,数据观测和事件配置之前被调用。
- created:在实例创建完成后被调用,此时可以访问到数据和方法,但是还未挂载到DOM上。
- beforeMount:在挂载开始之前被调用,此时模板编译已完成,但是还未将模板渲染到页面上。
- mounted:在挂载完成后被调用,此时组件已经被渲染到页面上,可以进行DOM操作。
2. 子组件的生命周期:
- beforeCreate:同父组件的beforeCreate。
- created:同父组件的created。
- beforeMount:同父组件的beforeMount。
- mounted:同父组件的mounted。
3. 父组件更新时的生命周期:
- beforeUpdate:在数据更新之前被调用,此时可以对更新前的状态进行操作。
- updated:在数据更新之后被调用,此时DOM已经更新完毕。
4. 子组件更新时的生命周期:
- beforeUpdate:同父组件的beforeUpdate。
- updated:同父组件的updated。
5. 组件销毁时的生命周期:
- beforeDestroy:在实例销毁之前被调用,此时实例仍然完全可用。
- destroyed:在实例销毁之后被调用,此时实例已经被销毁,无法再访问到实例的数据和方法。
阅读全文