Ant-d V4 Autocomplete 选中无法展示label about ant-design

[zombieJ]

你要展示 label 应该用 Select 动态加 option，AutoComplete 是输入框不是选择器。

[afc163]

你要展示 label 应该用 Select 动态加 option，AutoComplete 是输入框不是选择器。

+1

[JinHe-PerkinElmer]

你要展示 `label` 应该用 Select 动态加 `option`，AutoComplete 是输入框不是选择器。

我知道，这是正常Case, 使用没有问题。
但是，我们有一个需求是这样的：一个input同时支持可输/可选。所以我们V3是用AutoComplete做了二次封装。现在发现功能没了。。。

[afc163]

最好把你的需求详细展开说说。

[JinHe-PerkinElmer]

最好把你的需求详细展开说说。

主要问题就是Autocomplete，options配置了 { value, label }，选择的时候是默认显示value的，无法显示label。刚才本来想通过Children的input value去自定义显示内容，好像没成功。不行只能自己写一个了，先这样吧，周末愉快。

[afc163]

我是问你的原始需求，具体是什么业务场景的什么输入框需要同时支持可输/可选，又希望展示 label 而不是 value。另外这是单选还是多选？

[afc163]

如果是多选你可以使用：https://ant.design/components/select-cn#select-demo-tags

[JinHe-PerkinElmer]

我是问你的原始需求，具体是什么业务场景的什么输入框需要同时支持可输/可选，又希望展示 label 而不是 value。另外这是单选还是多选？

原始需求其实是两个：就是输入时，1. 先调接口查询展示一个列表，供用户选择（这部分Select可满足）2. 如果列表没有匹配项，保留用户输入的结果（相当于新增一条记录，Autocomplete组件功能）
关于展示问题：为什么要展示Label而不是Value，因为value我们是我们和后台交互用的，一般都是id，显示出来没有意义，label才是用户能识别的有意义的名称。

[afc163]

保留用户输入的结果（相当于新增一条记录，Autocomplete组件功能）

用户输入的内容是 value 还是 label 呢？

[JinHe-PerkinElmer]

保留用户输入的结果（相当于新增一条记录，Autocomplete组件功能）

用户输入的内容是 value 还是 label 呢？

用户输入的是Label，新增成功后，后台会生成对应ID。

[afc163]

https://stackblitz.com/edit/react-e2zkty?file=demo.tsx

tags + maxCount 感觉比较适配你的诉求。

  <Select
    mode="tags"
    maxCount={1}
  />

[JinHe-PerkinElmer]

https://stackblitz.com/edit/react-e2zkty?file=demo.tsx

tags + maxCount 感觉比较适配你的诉求。

  <Select
    mode="tags"
    maxCount={1}
  />

我明白你的意思，这是一个解决方案。实际上我已经参照autocomplete的定义，把输入、选择功能封装好了，正在调dropdown的UI。这样改，我只需要替换我们的common-lib中对应组件，不需要改其它使用的地方。