ant-design-vue
ant-design-vue copied to clipboard
select 多选时,悬浮在选项上的高亮,在内容浮层关闭后,再次点击下拉,之前的选项依然会高亮,但是单选就不会;这个是功能特性吗(官方的示例也是这样的),如果不想要这个高亮怎么处理?
- [ ] 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?
再次打开下拉内容浮层,之前的高亮没有消失
这一项被选择了
这一项被选择了
并没有选中这一项,只是鼠标移上去了,但是没有点击选中;不是选中的高亮,是悬浮的高亮
研究了下代码,应该是选择的浮层关闭时,没有清除当前“聚焦”导致的。
我在vc-select文件夹下的OptionList.tsx修改源码可以实现清除高亮
我研究了下ant.design和antdv的所有版本,发现都有类似的特性。
发现一个方法,可以实现你要的功能。
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),
}));
});
}
};
这种方式可能每个都要单独处理
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