ant-design Wrap < Select> with < Tooltip>, hover on < Option> shoud not show tooltip

wfauudbj 于 4个月前发布在其他

关注(0)|答案(4)|浏览(100)

Reproduction link

Steps to reproduce

click <select /> , hover on opened menu

What is expected?

don't show tooltip when user hover on the select options.

What is actually happening?

tooltip gets shown
| Environment | Info |
| ------------ | ------------ |
| antd | 4.20.6 |
| React | lastest |
| System | Macos |
| Browser | Chrome |

ant-design

来源：https://github.com/ant-design/ant-design/issues/35765

4条答案

按热度按时间

um6iljoc1#

You may look for issues:

50% Form.Item里的select样式问题，select宽度不受外部width限制. Select style in form. Item. Select width is not limited by external width #34512

🤖 By issues-similarity-analysis

赞(0）回复(0）举报 4个月前

e0uiprwp2#

I have the same issue. Is there any solution to this problem?

赞(0）回复(0）举报 4个月前

2o7dmzc53#

I have the same issue. Is there any solution to this problem?

I found a workaround. Attach the toolip to a transparent node like this:

<Select
  onMouseEnter={() => dropdownVisible || setShowTooltip(true)}
  onMouseLeave={() => setShowTooltip(false)}
  value={selectValue}
  onDropdownVisibleChange={open => {
    if (open) setShowTooltip(false)
    setDropdownVisible(open)
  }}
/>
<Tooltip
  visible={showTooltip}
  title={tooltipContent}
  placement='bottom'
>
  <div style={{ position: 'absolute', top: '20px', left: '45px' }}></div>
</Tooltip>

赞(0）回复(0）举报 4个月前

mutmk8jj4#

Another workaround
https://codesandbox.io/s/py6t3s?file=/demo.js

赞(0）回复(0）举报 4个月前