在semantic_ui-react 库中存在组件Accordion。有一些例子，但我必须制作嵌套的手风琴，它具有结构：
-accordion:
-sub_accordion1
-sub_accordion2
-sub_accordion3
我看到有带有面板的嵌套手风琴的示例，但我不想将手风琴放入面板中。我试过这样：
export default class AccordionExampleStandard extends Component {
state = { activeIndex: 0 }
handleClick = (e, titleProps) => {
const { index } = titleProps
const { activeIndex } = this.state
const newIndex = activeIndex === index ? -1 : index
this.setState({ activeIndex: newIndex })
}
render() {
const { activeIndex } = this.state
return (
<Accordion>
<Accordion.Title active={activeIndex === 0} index={0} onClick={this.handleClick}>
<Icon name='dropdown' />
What is a dog?
</Accordion.Title>
<Accordion.Content active={activeIndex === 0}>
<Accordion.Title active={activeIndex === 1} index={1} onClick={this.handleClick}>
<Icon name='dropdown' />
What kinds of dogs are there?
</Accordion.Title>
<Accordion.Content active={activeIndex === 1}>
Content1
</Accordion.Content>
<Accordion.Title active={activeIndex === 2} index={2} onClick={this.handleClick}>
<Icon name='dropdown' />
How do you acquire a dog?
</Accordion.Title>
<Accordion.Content active={activeIndex === 2}>
Content2
</Accordion.Content>
<Accordion.Title active={activeIndex === 3} index={3} onClick={this.handleClick}>
<Icon name='dropdown' />
What kinds of dogs are there?
</Accordion.Title>
<Accordion.Content active={activeIndex === 3}>
Content3
</Accordion.Content>
</Accordion.Content>
</Accordion>
)
}
}
它呈现组件，但我只能折叠主手风琴而不能折叠它的孩子。如何执行此功能？