ant-design / ant-design/pro-components
🐛[BUG]Layout 会自动给 http url 加上跳转事件
- Dominant language
- TypeScript
- Stars
- 4.8k
- Forks
- 1.4k
- Avg merge
- 10h 44m
- Merged PRs (30d)
- 3
Description
提问前先看看:
https://github.com/ryanhanwu/How-To-Ask-Questions-The-Smart-Way/blob/main/README-zh_CN.md
### 🐛 bug 描述
问题背景是我们想给 Menu 加 tooltip, 但是 antd 有一个 `a::before` 的样式覆盖了 a 标签,导致 tooltip 不生效,([antd issue](https://github.com/ant-design/ant-design/issues/48934))
为了解决这个问题,我们重设了 `a::before` 的样式,但是此时如果点击一个 http 链接,则会打开 2 个窗口。
这个原因是,ProLayout 内部会给 http 的链接绑定跳转事件([ProLayout 代码](https://github.com/ant-design/pro-components/blob/master/packages/layout/src/components/SiderMenu/BaseMenu.tsx#L428)),当我们在 `menuItemRender` 包装 `a` 标签时,由于解决上面 tooltip 的问题去掉了蒙层,就会导致一个点击事件,会被 `span` 和 `a` 都处理,就会导致打开 2 个窗口。
### 📷 复现步骤
https://stackblitz.com/edit/vitejs-vite-3bbuza?file=src%2FApp.tsx
- 点击“一级页面” 会出现 2 个窗口;
- 注释 `./App.css` 的内容,只会打开 1 个窗口,但是 tooltip 不生效;
### 🏞 期望结果
不要给 http url 注册 `window.open`, 交给使用方处理。
### 💻 复现代码
### © 版本信息
- ProComponents 版本: "@ant-design/pro-layout": "^7.19.0",
- umi 版本
- 浏览器环境: Chrome
- 开发环境 mac OS
### 🚑 其他信息
Contributor guide
Research direction
Start with packages/layout/src/components/SiderMenu/BaseMenu.tsx at the linked navigation logic, then reproduce the issue using the provided StackBlitz example and its App.css. Confirm the current behavior with an http menu URL and tooltip wrapper. Done means the URL opens only once while the tooltip workaround remains effective.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- react, typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Clearly specified
- Newbie friendliness
- 48/100