Javascript Vue.js渲染多个插槽

我有以下应用程序：

<template>
    <component :is="layout">
        <router-view :layout.sync="layout"/>
    </component>
</template>

<script>
    import LayoutBlank from './LayoutBlank'

    export default {
        name: 'app',
        data() {
            return {
                layout: LayoutBlank,
            };
        },
    }
</script>

从“./LayoutBlank”导入LayoutBlank
导出默认值{
名称：“应用程序”，
数据（）{
返回{
布局：布局空白，
};
},
}

从“./LayoutBlankTemplate”导入LayoutBlankTemplate
导出默认值{
名称：“LayoutBlank”，
创建（）{
此.$parent.$emit（'update:layout'，LayoutBlankTemplate'）；
},
render（）{
返回此.$slots.default[0]；
},
}

导出默认值{
名称：“LayoutBlankTemplate”，
}

测试内容
从“./LayoutBlank”导入LayoutBlank；
导出默认值{
名称：“BlankTest”，
组件：{LayoutBlank}，
}

一切正常。但现在我想在LayoutBlankTemplate中再添加一个插槽：

<template>
    <div>
        <slot></slot>
        <slot name="second"></slot>
    </div>
</template>

<script>
    export default {
        name: 'LayoutBlankTemplate',
    }
</script>

导出默认值{
名称：“LayoutBlankTemplate”，
}

并在空白测试中使用：

<template>
    <layout-blank>
        <template #default>Test content</template>
        <template #second>Second test content</template>
    </layout-blank>
</template>

<script>
    import LayoutBlank from './LayoutBlank';
    export default {
        name: 'BlankTest',
        components: {LayoutBlank},
    }
</script>

测试内容
第二次测试内容
从“./LayoutBlank”导入LayoutBlank；
导出默认值{
名称：“BlankTest”，
组件：{LayoutBlank}，
}

代码仅呈现默认插槽内容。问题是我正在使用

返回这个.slots.default[0]在LayoutBlank组件中，该组件仅呈现默认插槽内容

我找不到如何在LayoutBlank:：render（）方法中渲染所有插槽的方法。我知道我可以使用这个。$slots或这个。$scopedSlots获取插槽列表，但我找不到如何将它们传递到LayoutBlankTemplate以使其呈现。
我相信您可以将插槽放入您创建的元素中。渲染函数中（简要）提到了这一点

这可能不是您想要的布局，但例如

<script>
import LayoutBlankTemplate from './LayoutBlankTemplate'

export default {
  name: 'LayoutBlank',
  created() {
    this.$parent.$emit('update:layout', LayoutBlankTemplate);
  },
  render(createElement, context) {
    return createElement('div', {}, [
      createElement('div', {}, this.$slots.default),
      createElement('div', {}, this.$slots.second)
    ])
  },
}
</script>


从“./LayoutBlankTemplate”导入LayoutBlankTemplate
导出默认值{
名称：“LayoutBlank”，
创建（）{
此.$parent.$emit（'update:layout'，LayoutBlankTemplate'）；
},
渲染（createElement，上下文）{
返回createElement（'div'，{}[
createElement（'div'，{}，this.$slots.default），
createElement（'div'，{}，this.$slots.second）
])
},
}

<template>
    <div>
        <slot></slot>
        <slot name="second"></slot>
    </div>
</template>

<script>
    export default {
        name: 'LayoutBlankTemplate',
    }
</script>

<template>
    <layout-blank>
        <template #default>Test content</template>
        <template #second>Second test content</template>
    </layout-blank>
</template>

<script>
    import LayoutBlank from './LayoutBlank';
    export default {
        name: 'BlankTest',
        components: {LayoutBlank},
    }
</script>

<script>
import LayoutBlankTemplate from './LayoutBlankTemplate'

export default {
  name: 'LayoutBlank',
  created() {
    this.$parent.$emit('update:layout', LayoutBlankTemplate);
  },
  render(createElement, context) {
    return createElement('div', {}, [
      createElement('div', {}, this.$slots.default),
      createElement('div', {}, this.$slots.second)
    ])
  },
}
</script>