Vue 在生命周期的什么阶段，所有子组件都被挂载完毕？

[weixin_38049129]

问题：最近在重构代码是被一个问题困惑了两天，那就是Vue在生命周期的什么阶段，所有子组件都会被挂载完毕？ 背景：场景是这样的，我将页面的header部分使用component独立了出来，并在header中具有用标签加载背景图，背景图比较大，由于图片是根据路由不同，动态从config文件加载的，所以header的高度也是动态变化的，于是我就想获取header的高度。 具体情况： 我的第一直觉是在生命周期的某个阶段来使用ref或DOM来获取这个高度的值，于是我开始使用尝试在mounted中获取height，得到的结果是18，实际应该是78（在盒模型看到的），文档提到mounted阶段“不会承诺所有子组件也都一起被挂载”，我觉得应该是我的图片比较大，导致了munted执行header还没有渲染完成导致的，文档推荐的nexttick我也试了，也不行。 问题： 到底应该怎么在页面加载之初就自动获取header的高度属性的？也就是在什么地方，能够确定所有组件都挂载完了？

[weixin_38082853]

我使用setTimeout延迟执行获取高度，500毫秒（没有去尝试更小的值），就可以获取正确的值了，也就是问题其实已经解决了，主要是探讨下，有没有更正规的形式。

[weixin_38142878]

是不是可以给你的header绑定一个监听高度的方法，当高度变化时，执行你想要的代码

[weixin_38056966]

感觉也是一种解决方式，但是觉得和setTimeout一样都属于替代方案，因为我碰到的问题比较简单，仅仅是一个header组件，如果页面具有大量的组件的话，每个都绑定一个监听感觉不是很“清真”，就是想知道有没有一个类似生命周期钩子的东西，能够在一个地方明确，虽有子组件，均已挂载完毕，在那里统一操作。

[weixin_38098470]

看了一下，你之前用的nexttick没用，试过$nexttick了吗？

[weixin_38108505]

你在子组件的mounted钩子函数里执行一个函数，然后去触发父组件的某个函数去获取header的高度，不是很确定这样行不行，仅供参考:grinning:

[weixin_38111004]

这样试一下，在这个方法里 调用 ref 获取高度