Ant Design 的 Select 组件怎么优雅应对大数据量情况下的预填值？

[WangLiCha]

标题可能不太好说清楚，我具体描述下场景：

项目里用了 Ant Design ，里面有一个表单包含一个 Select 组件，这个组件的 options 通过接口获取，接口返回的全部数据量可能非常大（比如 1000 个吧），所以设置为默认下拉只通过接口获取 50 个选项，用户可以通过设置了 showSearch 的搜索来搜索到更具体的选项值。

这个表单同时还可以编辑修改，当再次进入表单界面后，后端接口返回了 Select 组件上次提交的 value 值，表单根据这个值进行了 setFieldValue 的操作，但是因为默认的 options 只获取了前 50 个，所以很有可能这个 value 对应的 label 并不在当前的 options 里面，用户看到的就是一串 code 而非他能看懂的文字。

那么有什么办法可以让用户在使用这个页面的时候可以非常自然的使用呢？初次可以通过搜索选取值，后期修改进入进入界面看到的不是 code ，再次点击修改也能正常完成操作？（当然肯定不会考虑接口同时返回全部数据的做法，不然也不会想尽办法折腾了）

[orange2023]

进入表单编辑页的时候，使用上次选择的 value 和 label ，设置一次 Select 的 options 。

[WangLiCha]

@orange2023 这里的问题在于后端没法返回 label 值……当然也可以再去调接口查询，但是显得很笨拙

[CrushMiss]

@WangLiCha select 标签有一个 labelInValue 属性，可以把 value 变更为{label,value}的形式，保留这样的格式存取就可以了

[Xavier08]

labelInValue ，回显的时候会用这个对象里的 label ，不会从选项里匹配

[AtlantaANiu]

接口加查询字段，把当前的选项 id 传给后端并要求返回

[hoo0117]

很简单的排序业务逻辑，首先前端肯定解决不了这个问题的，每次请求 50 条数据，后端把这个 code 排到第一个，每次查的时候带着这个 code 去查，避免后面再次出现这个 code 的 option ，如果做下拉加载的话就让后端再出一个接口反查分页参数