在我的reactJS应用程序中,我使用了一个包含IconButton的Material UI工具提示列表,作为包含overflow: scroll
的div
容器中的子项。在一个特定行中,Material UI工具提示如下所示:
<ClickAwayListener onClickAway={handleTooltipClose}>
<Tooltip
PopperProps={{
disablePortal: true,
}}
onClose={handleTooltipClose}
open={open}
disableFocusListener
disableHoverListener
disableTouchListener
title={data}
arrow
>
<InfoOutlinedIcon
className={classes.root}
onClick={handleTooltipOpen}
/>
</Tooltip>
</ClickAwayListener>
工具提示的位置和显示也不正确:
第一节第一节第一节第一节第一次
我不能在包含表格和工具提示的div容器上使用overflow: visible;
,因为我需要滚动行为,有没有什么方法可以使工具提示从容器中弹出而不进行剪切?
2条答案
按热度按时间hgc7kmma1#
材质-UI使用
Popper.js
。你可以通过工具提示PopperProps使用不同的Popper.js Options来处理这类情况。在你的场景中,我认为你可以使用preventOverflow
修饰符6xfqseft2#
在我的例子中,我修复了与禁用Popper的flipmoddifier几乎相同的问题: