Ant Design 的 AutoComplete 组件下拉反复拖动几次,选项开始重复

更新日期: 2024-12-12 阅读次数: 148 字数: 299 分类: ReactJS

第一次使用 Ant Design 的 AutoComplete 组件,发现当选项中有重复数据时,就会出现这种情况。 下拉过程中,出现大量不断重复的选项,严重影响使用体验。

解决方法

很简单,就是保证后台接口返回的选项列表,不要出现重复选项。

看了一下后台的 golang 逻辑,确实没有处理好前后空格的过滤,导致部分人名出现了重复选项。

但,这不是重点,重点是,我发现了 golang 新版本的 slices 去重函数,非常方便。

golang slice 去重

1.21 之后有个简单的实现方案,好在我的是 1.23:

package main

import (
    "fmt"

    "slices"
)

func main() {
    list := []string{"c", "a", "b", "c", "b", "b"}
    slices.Sort(list)
    fmt.Println(slices.Compact(list)) // [a b c]
}

参考

https://pkg.go.dev/slices#Compact

不排序呢

如果不排序,则达不到去重的效果:

this only works if the duplicate items appear in a consecutive order, if they are scrambled across the slice it will not work.

package main

import (
	"fmt"

	"slices"
)

func main() {
	list := []string{"c", "a", "b", "c", "b", "b"}
	//slices.Sort(list)
	fmt.Println(slices.Compact(list)) // [c a b c b]
}

参考

https://blog.csdn.net/qq_39181017/article/details/122959753

微信关注我哦 👍

大象工具微信公众号

我是来自山东烟台的一名开发者,有感兴趣的话题,或者软件开发需求,欢迎加微信 zhongwei 聊聊, 查看更多联系方式