如何让子组件自动设置自己的插槽？

Question

页面组件：

<template>
  <div class="page">
    <div class="header">
      <slot name="header"></slot>
    </div>
    <div class="content">
      <slot></slot>
    </div>
  </div>
</template>

PageHeader组件：

<template #header>
  <div class="header">
    <slot></slot>
  </div>
</template>

您可能已经注意到PageHeader组件中的#header属性。

是的，我希望PageHeader组件自动插入到Page组件的页眉槽中。

所以，我可以这样做（如果#header指令有效）

<template>
  <page>
    <page-header>header</page-header>
    <div>some content</div>
  </page>
</template>

代替此：

<template>
  <page>
    <page-header slot="header">header</page-header>
    <div>some content</div>
  </page>
</template>