react-awesome-query-builder异步Select点击外部清空、选中重复触发asyncFetch问题

问题原因&解决方案 #

这两个问题均不属于库本身的bug，是缺少对应配置项、异步请求逻辑适配不当导致的，具体修复方式如下：

问题2（选中后重复触发asyncFetch）修复 #

在fieldSettings中新增fetchOnlyOnSearch: true配置即可：

fieldSettings: {
  // 保留原有配置
  fetchOnlyOnSearch: true, // 新增该行
}

该配置的作用是仅当用户主动在搜索框输入内容时才触发asyncFetch请求，选中值、组件失焦等场景都不会自动发起请求，直接解决不必要的重复调用问题。

问题1（点击外部清空选中值）修复 #

出现该问题的根因是：你开启了allowCustomValues: false，而选中值后触发的空参数异步请求返回的选项列表中，没有包含你已选中的值，库在校验时找不到对应选项就会自动清空值。
根据业务场景可以二选一修复：

• 方案一：调整asyncFetch的空搜索逻辑，空搜索时不要传'null'参数，而是返回包含已选中值的选项列表，或者返回全量top N选项，确保选中的 value 始终能在返回的选项列表中被匹配到。
• 方案二：如果不需要严格限制选中值必须在搜索返回列表内，直接将allowCustomValues改为true即可，即使选中值不在当前加载的选项列表里也不会被清空。

内容的提问来源于stack exchange，提问作者Silviu ION