[material-ui][Tooltip] Stays visible on scroll

tv6aics1  于 6个月前  发布在  其他
关注(0)|答案(8)|浏览(51)

重现步骤 🕹

链接到实时示例: https://codesandbox.io/s/mui-tooltip-scroll-bug-88jrqh
步骤:

  1. 将鼠标悬停在一个测试项目上
  2. 向上或向下滚动

当前行为 😯

工具提示在滚动停止之前一直可见

预期行为 🤔

当用户滚动时,工具提示应该关闭

上下文 🔦

我们有一个带有工具提示的数据表,而在表格中滚动会导致与工具提示的奇怪交互。当用户滚动时,工具提示会保持在视图之外的元素上可见。

你的环境 🌎

npx @mui/envinfo

System:
    OS: macOS 13.4
  Binaries:
    Node: 16.16.0 - ~/.nvm/versions/node/v16.16.0/bin/node
    Yarn: 1.22.19 - ~/.nvm/versions/node/v16.16.0/bin/yarn
    npm: 8.19.4 - ~/.nvm/versions/node/v16.16.0/bin/npm
  Browsers:
    Chrome: 115.0.5790.170
    Edge: Not Found
    Safari: 16.5
  npmPackages:
    @emotion/react: 11.10.4 => 11.10.4 
    @emotion/styled: 11.10.4 => 11.10.4 
    @mui/base:  5.0.0-beta.7 
    @mui/core-downloads-tracker:  5.14.0 
    @mui/icons-material: ^5.8.2 => 5.11.9 
    @mui/material: ^5.14.0 => 5.14.0 
    @mui/private-theming:  5.13.7 
    @mui/styled-engine:  5.13.2 
    @mui/styles: ^5.11.11 => 5.11.11 
    @mui/system:  5.14.0 
    @mui/types:  7.2.4 
    @mui/utils:  5.13.7 
    @types/react: 18.0.28 => 18.0.28 
    react: 18.2.0 => 18.2.0 
    react-dom: 18.2.0 => 18.2.0 
    typescript: 4.7.4 => 4.7.4
aurhwmvo

aurhwmvo1#

在这里创建了一个PR:#38390

dhxwm5r4

dhxwm5r42#

这是一个回归问题,它曾经是有效的,证明:
v4.12.4: https://v4.mui.com/components/tooltips/ OK
v5.0.6 https://v5-0-6.mui.com/components/tooltips/ KO
我认为弄清楚是什么导致了这个问题很重要,这样我们就能更好地理解根本原因并采取最佳的修复措施。

t8e9dugd

t8e9dugd3#

我和你遇到了同样的问题,在滚动正文时没有问题,但是在滚动内部的盒子或div时,问题就出现了。那么如何解决这个问题呢?是在滚动并关闭它的时候吗?

jyztefdp

jyztefdp4#

oliviertassinari有关于这个的更新吗?

ohfgkhjo

ohfgkhjo6#

对此有任何进一步的发展或提出的解决方案吗?

vlf7wbxs

vlf7wbxs7#

看起来Tooltip是由Michal拥有的,链接是:https://www.notion.so/mui-org/Components-Data-Display-c8b5898e818f41eeae839ac61e053d67?pvs=4#57df8e0eaa8a448cb2ead85c1d3ae28c。Jun的任务已被移除。

55ooxyrt

55ooxyrt8#

我花时间调试了这个问题,发现它与在 #21761 中完成的 Popper.js 版本升级有关。在 Popper.js v1 之前,它曾经可以正常工作。我通过用 Material UI v4 代码和 Popper.js v1 替换 Tooltip 和 Popper 组件代码来确认这一点,结果如预期般工作。然而,一旦切换到 Popper.js 版本 2.4.4,它就停止工作了。我无法确定为什么在 Popper.js v2 中出现了这种行为变化。

相关问题