reactjs - 将 Material UI 菜单渲染为 并将其子项渲染为 ？

Question

我有一个 Material UI Menu , 重新命名为 <div> > <ul> <li>默认。我想把它变成一个 <div> <nav> <a> .

我可以更改 MenuItem变成<a> .但我找不到打开 <ul> 的方法进入<nav> , 没有 component支柱。 Material UI 是如此可定制，以至于我确信我遗漏了什么，这是我的错误。

<Menu open={true}>
  <MenuItem component='a'>Profile</MenuItem>
  <MenuItem component='a'>Settings</MenuItem>
  <MenuItem component='a'>Logout</MenuItem>
</Menu>

我还可以使用 MenuList API作为 Menu 的 child , 但它只会呈现 <ul> 下面的另一个级别.

Answer 1

MenuList 继承 props来自 List 组件，您可以使用它来将 ul 更改为 nav

<Menu
  open={true}
  MenuListProps={{
    "aria-labelledby": "basic-button",
    component: "nav"
  }}
>