从插槽组件到子组件的反应实现

Question

大家好，我有这个基于React Semantic UI的组件，基本上是一个插槽组件。

const StickyHeader = ({ title, subtitle, toolbar }) => (
  <div>
    <div>
      <Container>
        <Grid>
          <Grid.Column>
            <Header>
              {title}
              <Header.Subheader>
                {subtitle}
              </Header.Subheader>
            </Header>
          </Grid.Column>
          <Grid.Column>
            {toolbar}
          </Grid.Column>
        </Grid>
      </Container>
    </div>
  </div>
);

我想修改其实现，以便能够以这种方式实例化它：

<StickyHeader>
    <StickyHeader.title>My title</StickyHeader.title>
    <StickyHeader.subtitle>My subtitle</StickyHeader.subtitle>
    <StickyHeader.toolbar>My toolbar</StickyHeader.toolbar>
</StickyHeader>

有可能吗？你能帮助我吗？ 非常感谢