ant-design-vue icon indicating copy to clipboard operation
ant-design-vue copied to clipboard

select 多选时,悬浮在选项上的高亮,在内容浮层关闭后,再次点击下拉,之前的选项依然会高亮,但是单选就不会;这个是功能特性吗(官方的示例也是这样的),如果不想要这个高亮怎么处理?

Open Miss-An opened this issue 1 year ago • 5 comments
trafficstars

  • [ ] I have searched the issues of this repository and believe that this is not a duplicate.

Version

3.2.20

Environment

windows ,chrome、vue3

Reproduction link

https://3x.antdv.com/components/select-cn/#components-select-demo-custom-dropdown

Steps to reproduce

select 设置多选; 鼠标悬浮到一个选项上会高亮,然后移除内容浮层 点击浮层关闭后,再次打开下拉内容浮层,之前的高亮还在

What is expected?

再次打开下拉内容浮层,之前的高亮消失

What is actually happening?

再次打开下拉内容浮层,之前的高亮没有消失

Miss-An avatar Jan 24 '24 10:01 Miss-An

这一项被选择了

selicens avatar Jan 24 '24 10:01 selicens

这一项被选择了

并没有选中这一项,只是鼠标移上去了,但是没有点击选中;不是选中的高亮,是悬浮的高亮

Miss-An avatar Jan 25 '24 01:01 Miss-An

研究了下代码,应该是选择的浮层关闭时,没有清除当前“聚焦”导致的。 我在vc-select文件夹下的OptionList.tsx修改源码可以实现清除高亮 code-20240204 我研究了下ant.design和antdv的所有版本,发现都有类似的特性。

qppq54s avatar Feb 04 '24 07:02 qppq54s

发现一个方法,可以实现你要的功能。

const dropdownVisibleChange = (open: boolean) => {
      if (open) {
        options.value = [...Array(25)].map((_, i) => ({
          value: (i + 10).toString(36) + (i + 1),
          disabled: true,
        }));
        setTimeout(() => {
          options.value = [...Array(25)].map((_, i) => ({
            value: (i + 10).toString(36) + (i + 1),
          }));
        });
      }
    };

qppq54s avatar Feb 04 '24 08:02 qppq54s

这种方式可能每个都要单独处理

Miss-An avatar Mar 25 '24 02:03 Miss-An

This issue is stale because it has been open 60 days with no activity. Remove stale label or comment or this will be closed in 7 days

github-actions[bot] avatar May 25 '24 02:05 github-actions[bot]