CustomComponent 嵌套 <component :is="component"> 子组件编译不通过问题

[sunvictor]

需求：想实现一个切换 Child1、Child2 组件且共用 Parent.vue 模板的功能，但是 Child1.vue 和 Child2.vue 编译不通过，以下是具体代码

./Parent.vue

<template>
  <div>
    <div class="header">
      <div class="header__text">标题</div>
      <div class="header_extra">
         <slot name="header-extra"></slot>
      </div>
    </div>
    <div class="body">
       <slot></slot>
    </div>
  </div>
</template>

./Child1.vue

<template>
   <template #header-extra>
      extra
  </template>
   <template #default>
      body
  </template>
</template>

./Child2.vue

<template>
   <template #header-extra>
      extra2
  </template>
   <template #default>
      body2
  </template>
</template>

./Cell.vue

<script setup>
import Child1 from "./Child1.vue";
import Child2 from "./Child2.vue";
</script>

<template>
  <Parent>
     <component :is="Child1"/>
  </Parent>
</template>

[YahaneXy]

<template>
    <slot name="header-extra">
   </slot>
    <slot v-if="$slots.default">
       default content
   </slot>
 </template>

https://cn.vuejs.org/guide/components/slots.html#fallback-content
https://cn.vuejs.org/api/component-instance.html#slots

[sunvictor]

改 Parent.vue 文件？但是 Child1.vue 和 Child2.vue 还是编译不通过

[YahaneXy]

改child文件，slot是写在组件里的，#header-extra是写在引用组件的文件里的

[YahaneXy]

你可以翻阅一下文档，文档里有说明，我发的代码示例是子组件的示例

[sunvictor]

help

[sunvictor]

help

[sunvictor]

help