子组件的mounted钩子是已经挂载在页面上还是挂载在父组件上？

来源：3-8 生命周期

纷纷2004

2019-07-15

如果是挂在页面上，我记得之前课程讲的不是先父子组件生成一份dom再挂上去的？那为什么会是mounted是子先执行，父后执行，还是我哪里理解错了？

写回答

1回答

ustbhuangyi

2019-07-16

首先，mounted 钩子执行是在 patch.js 内部通过执行 invokeInsertHook 触发的，它内部是通过遍历 insertedVnodeQueue 依次执行。而这个函数的执行的时候，vnode 节点都已经通过 DOM API 插入到真实 DOM 中了。
其次，为什么子组件和 mounted 先执行，而父组件的后执行，在不考虑异步组件的情况下，Vue 是通过递归的方式创建整个组件树的，子组件的 vnode 会先于父组件添加到 insertedVnodeQueue 中，所以最终遍历 insertedVnodeQueue 的时候，也是子组件的 mounted 先执行。

Vue.js 源码深入解析深入理解Vue实现原理

全方位讲解 Vue.js 源码，进阶高级工程师

4986 学习 · 1038 问题

查看课程

相似问题

mounted 钩子函数

回答 1

$store的挂载疑惑

回答 1

关于父子组件的watcher问题

回答 2

异步组件

回答 2

为什么 createElm在是组件渲染vnode时构建整个组件树的时候，是先子后父，而且需要创建父节点占位符? 如果是普通文本节点，是直接插入吗？

回答 1

打开慕课网App查看更多内容