react-admin中ReferenceInput+Autocomplete输入无结果问题求助

核心问题是你当前的filterToQuery生成的查询参数和Postman中能正常工作的like查询格式不匹配，且配置位置有误。React-admin中ReferenceInput负责向关联资源发起查询请求，因此filterToQuery需要配置在ReferenceInput上，同时要生成Loopback4要求的模糊查询结构。

修正步骤 #

1. 调整filterToQuery的返回值，生成Loopback4需要的like模糊查询结构
2. 将filterToQuery配置到ReferenceInput组件上
3. 移除AutocompleteInput上多余的source属性（无需重复设置，会继承ReferenceInput的配置）

修正后的代码示例 #

// 生成符合Loopback4规范的模糊查询参数
const filterToQuery = (searchText) => ({
  where: { 
    description: { 
      like: `%${searchText}%`, // 前后添加%实现全匹配，可根据需求调整匹配范围
      options: "i" // 忽略大小写
    } 
  },
});

const machineFilters = [
  <ReferenceInput
    source='category_id'
    reference='categories'
    alwaysOn={true}
    sort={{ field: 'code', order: 'ASC' }}
    filterToQuery={filterToQuery} // 将查询配置放在ReferenceInput上
  >
    <AutocompleteInput
      style={{ width: '300px' }}
    />
  </ReferenceInput>,
];

额外检查点 #

• 确认你的react-admin数据提供者（自定义或第三方Loopback适配版本）能正确传递where参数，保证前端请求URL格式与Postman一致
• 若部门筛选存在同样问题，对departments对应的ReferenceInput执行相同配置调整

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