Material-UI-工具提示在悬停时保持打开状态,带有嵌套的弹出框

时间:2019-02-04 16:53:45

标签: material-ui

我在创建可悬停的工具提示时遇到问题。工具提示中应有一个按钮,可用于打开弹出窗口。我的问题是,一旦我打开弹出窗口,它就会关闭工具提示。弹出窗口也显示在工具提示的后面。

<Tooltip
    interactive
    title={<Content />}
    placement="right-start"
>

内容:

return (
    <div>
      <Button
        aria-owns={open ? 'simple-popper' : undefined}
        aria-haspopup="true"
        variant="contained"
        onClick={this.handleClick}
      >
        Open Popover
      </Button>
      <Popover
        id="simple-popper"
        open={open}
        anchorEl={anchorEl}
        onClose={this.handleClose}
        anchorOrigin={{
          vertical: 'bottom',
          horizontal: 'center',
        }}
        transformOrigin={{
          vertical: 'top',
          horizontal: 'center',
        }}
      >
          The content of the PopoverThe content of the the Popover.The content of the PopoverThe content of the the Popover.The content of the PopoverThe content of the the Popover.</Typography>
      </Popover>
    </div>
  );

编辑:创建了一个代码沙箱https://codesandbox.io/s/6w26o2ww0z

0 个答案:

没有答案