Как сделать подменю в компоненте Popover материала - PullRequest
0 голосов
/ 11 мая 2019

Я хотел бы создать подменю с элементами (используя компоненты Popover и MenuItem). Не могу понять, как расположить подменю так, чтобы оно располагалось слева от родительского элемента.

Я попытался сделать родительским position: relative, однако оболочка не позволяет отображать подменю за пределами потока Popover.

<Popover
  id="simple-popper"
  open={open}
  anchorEl={anchorEl}
  onClose={this.handleClose}
  anchorOrigin={{
    vertical: "bottom",
    horizontal: "center"
  }}
  transformOrigin={{
    vertical: "top",
    horizontal: "center"
  }}
>
  <MenuItem>
    Link 1
    <Paper
      style={{
        position: "absolute"
      }}
    >
      <MenuItem>SubLink 1</MenuItem>
      <MenuItem>SubLink 2</MenuItem>
      <MenuItem>SubLink 3</MenuItem>
    </Paper>
  </MenuItem>
  <MenuItem>Link 2</MenuItem>
  <MenuItem>Link 3</MenuItem>
  <MenuItem>Link 4</MenuItem>
</Popover>;

Я бы хотел реализовать классическое меню дизайна двухуровневого материала

...