Skip to content

fix: 修复 Dropdown 嵌套使用 absolute 时子级菜单项点击无法触发 onClick 的问题 - #2217

Merged
saint3347 merged 3 commits into
masterfrom
fix/dropdown-mousedown-clickaway
May 28, 2026
Merged

saint3347 merged 3 commits into
masterfrom
fix/dropdown-mousedown-clickaway

Conversation

@saint3347

Copy link
Copy Markdown
Contributor

问题描述

Dropdown 嵌套使用 absolute 属性时(内层 Dropdown 的列表 portal 到指定容器),点击子级菜单项无法触发 onClick 回调,弹出层直接消失。

原因分析

#2187 (a512cfe) 将 Dropdown 的 toggleDocumentEvent 从 mousedown 改为 click,导致:

  • 内层 absolute Dropdown 的列表通过 portal 挂载到外部容器
  • click 事件的 capture 阶段 clickAway 先于 React 合成事件处理
  • 子级菜单项的 React onClick 无法正常触发

修复方案

  1. 将 toggleDocumentEvent 的事件改回 mousedown
  2. 在 clickAway 中增加对 trigger button 区域的判断:如果 mousedown 发生在 Dropdown 自身的 button 元素内,跳过 clickAway,由 handleFocus(click 事件)处理 toggle

这样既修复了嵌套 absolute Dropdown 的问题,又不会回退 #2187 解决的两个问题:

  • 受控模式下点击 placeholder 无法关闭下拉框
  • onCollapse 触发两次

Regression

Since 2.0.29 (#2187)

关联

修复 #2187 引入的副作用

问题原因:a512cfe7 将 Dropdown 的 document 事件从 mousedown 改为 click,
导致嵌套 absolute 的子 Dropdown 菜单项的 React 合成 onClick 无法触发。

修复方案:将事件改回 mousedown,并在 clickAway 中增加对 trigger button 区域的
判断,避免 mousedown 与 click 的竞态问题(受控模式下点击 placeholder 无法关闭)。

Regression: since 2.0.29 (#2187)
@saint3347
saint3347 merged commit f45c8fb into master May 28, 2026
1 check passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant