Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

MenuItem 的 Label 中使用 Tooltip 不生效 #48933

Closed
Yawenina opened this issue May 15, 2024 · 2 comments
Closed

MenuItem 的 Label 中使用 Tooltip 不生效 #48933

Yawenina opened this issue May 15, 2024 · 2 comments

Comments

@Yawenina
Copy link
Contributor

Reproduction link

Edit on StackBlitz

Steps to reproduce

hover 到 “有Before” 菜单时,没有 tooltip 提示;
hover 到 “没有Before” 菜单时,有 tooltip 提示;

What is expected?

不需要单独配置 css 样式,让 tooltip 生效

What is actually happening?

antd 内部,会给 menu-item a 加上::before 的样式的蒙层,导致 hover 时,无法选中 tooltip 中的 trigger, 就不会触发 tooltip 提示。
当去掉这个 ::before 样式,则 tooltip 生效
image

====== 题外话
不知道加这个样式的出发点是什么,但是在结合 ProLayout 一起使用的时候,如果通过在项目中加 css 来解决这个问题,
在 ProLayout 中又会出现:点击一个链接,打开 2个窗口的问题,这个是 demo
这个原因是 ProLayout 内部会给 http 的链接绑定跳转事件(ProLayout 代码),当在这个外层包一个 a 标签时,由于 antd menu 的样式,不会有打开 2 个窗口的问题。但是为了解决 tooltip 的问题,一旦把a::before 的样式去掉,则会打开 2 个窗口。

Environment Info
antd 5.17.2
React 18.3.1
System Mac
Browser Chrome
Copy link

stackblitz bot commented May 15, 2024

Copy link
Contributor

Hello @Yawenina, your issue has been closed because it does not conform to our issue requirements. Please use the Issue Helper to create an issue, thank you!

你好 @Yawenina,为了能够进行高效沟通,我们对 issue 有一定的格式要求,你的 issue 因为不符合要求而被自动关闭。你可以通过 issue 助手 来创建 issue 以方便我们定位错误。谢谢配合!

@github-actions github-actions bot closed this as not planned Won't fix, can't repro, duplicate, stale May 15, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

1 participant