Javascript getter在子插槽组件中的v-if之前被调用

我创建了一个vue组件，我想做一些逻辑，并根据逻辑渲染插槽中的任何内容

<logic-component>
 <div>{{ data }}</div>
</logic-component>

数据是从全局存储/服务获取的，如果在逻辑组件准备就绪时实现了该存储/服务

组件逻辑如下所示：

<div v-if="logicIsReady"><slot></slot></div>

因此默认情况下，

logicsready

设置为false，但getter是在调用之前调用的

现在，通过vue生命周期，我知道vue会尝试解决当前组件绑定问题，然后再解决子组件绑定问题。但正如你所看到的，这里是不同的

仅当

v-if

为

true

时，我如何才能渲染插槽中的任何内容

我可以在vue中做些什么

---

如果我使用v-if而不是组件，它可以工作，但这不是我想要的方式。

您可以将

v-if

逻辑保留在子级中，但父级需要更改其语法并使用显式：

{{data}}

默认插槽实际上是一个名为“default”的插槽。通过封装在显式的

模板

，

逻辑组件

有机会决定何时渲染它

<div v-if="logicIsReady"><slot></slot></div>