reactjs - 在主菜单中打开嵌套菜单 - material-ui (react)

Question

(我没有足够的声誉来发布超过 2 个链接，因此我写出了 URLS)

在 material-ui (w*w.material-ui.com) 中，我可以编写嵌套菜单和下拉菜单。但是我还没有找到在主菜单中打开嵌套菜单的示例。

对于嵌套菜单和下拉菜单，嵌套菜单每次都会作为主菜单旁边或上方的新窗口打开。像这个例子:Menu with nested menu opened to the right

但我想在主菜单中打开嵌套菜单。像这个例子: Nested menus open in main menu

谁能告诉我一个如何实现这个的例子。谢谢

Answer 1

您使用了错误的组件。使用具有 NestedItems 的 ListItems 的列表

  <List>
    <Subheader>Nested List Items</Subheader>
    <ListItem primaryText="Sent mail" leftIcon={<ContentSend />} />
    <ListItem primaryText="Drafts" leftIcon={<ContentDrafts />} />
    <ListItem
      primaryText="Inbox"
      leftIcon={<ContentInbox />}
      initiallyOpen={true}
      primaryTogglesNestedList={true}
      nestedItems={[
        <ListItem
          key={1}
          primaryText="Starred"
          leftIcon={<ActionGrade />}
        />,
        <ListItem
          key={2}
          primaryText="Sent Mail"
          leftIcon={<ContentSend />}
          disabled={true}
          nestedItems={[
            <ListItem key={1} primaryText="Drafts" leftIcon={<ContentDrafts />} />,
          ]}
        />,
        <ListItem
          key={3}
          primaryText="Inbox"
          leftIcon={<ContentInbox />}
          open={this.state.open}
          onNestedListToggle={this.handleNestedListToggle}
          nestedItems={[
            <ListItem key={1} primaryText="Drafts" leftIcon={<ContentDrafts />} />,
          ]}
        />,
      ]}
    />
  </List>