工具提示组件在<listitemsecondaryaction>组件中不起作用

时间:2018-07-06 13:20:44

标签: laravel reactjs material-ui

我正在尝试为ListItemSecondaryAction的子组件提供工具提示,该子组件是IconButton组件,但是它不可见。

代码结构如下

<ListItemSecondaryAction>
    <Tooltip
        id="tooltip-remove-log-entry"
        placement="top"
        title="Tool Tip"
    >
        <IconButton
            tooltip="Remove Log Entry"
            variant="fab"
            color="primary"
            style={{ zIndex: 9999 }}
            aria-label="Remove Log Entry"
            onClick={() => {
                this.removeLog(log.id, i);
            }}
        >
            <ClearIcon />
        </IconButton>
    </Tooltip>
</ListItemSecondaryAction>

我发现的是

  1. 工具提示div附加在标签
  2. 之前
  3. 如果我给工具提示div的包装器div指定z-index:1,则它是可见的。

这是工具提示的附加结构

<div style="position: absolute; will-change: transform; top: 0px; left: 0px; transform: translate3d(1566px, 176px, 1px);">
    <div id="tooltip-remove-log-entry" role="tooltip" aria-hidden="true" class="MuiTooltip-tooltip-473 MuiTooltip-tooltipPlacementTop-477">Tool Tip
    </div>
</div>

任何建议都会有所帮助。

谢谢。

0 个答案:

没有答案