svelte - 我可以使用开槽组件在 svelte 中显示其他组件吗？

Question

您好我正在使用 _layout 将我的应用程序分成这样的部分

_layout.html

    <div class="container"> <-- creates a 12 column grid
      {#if $user} 
        <Header /> <-- spans the first row of the 12 columns
        <Menu segment={child.segment}/> <-- spans the first 2 columns of the remaining rows
        <Content slot={child.component}/> <-- spans the other 10 columns
      {:else}
        <Login /> 
      {/if}
    </div>

这就是我想要实现的

目前我使用内容组件中的 svelte 生命周期挂钩手动将“要显示的组件”设置到插槽中，但这感觉不对，因为路由不包含要显示的组件

<content>
  <slot>
    {#if dashboard}
      <Dashboard />
    {:elseif users}
      <Users />
    {/if}
  </slot>
</content>

<script>
  var dashboard, users = false;

   export default {
     oncreate() {
       this.dashboard = true;
     },
     ...

感觉我应该通过路由'/'和'/users'包含组件，并且内容组件应该只显示child.component

Answer 1

根据 Svelte 文档，“插槽可以包含任何东西”

在我的示例中，根本不需要插槽，我只需要包含组件并控制每个都显示有一个变量。

我想这篇文章的要点是：即使一个插槽可以包含任何东西，但这并不意味着它应该包含。