是否可以在React Admin v3中将用户搜索过滤器添加到ReferenceManyField中？

Question

使用React Admin，可以将过滤器添加到列表组件。在演示中可以看到一个示例：https://marmelab.com/react-admin-demo/#/commands

此特定组件的代码：https://github.com/marmelab/react-admin/blob/master/examples/demo/src/orders/OrderList.js

const OrderFilter = withStyles(filterStyles)(({ classes, ...props }) => (
<Filter {...props}>
    <SearchInput source="q" alwaysOn />
    <ReferenceInput source="customer_id" reference="customers">
        <AutocompleteInput
            optionText={choice =>
                `${choice.first_name} ${choice.last_name}`
            }
        />
    </ReferenceInput>
    <DateInput source="date_gte" />
    <DateInput source="date_lte" />
    <TextInput source="total_gte" />
    <NullableBooleanInput source="returned" />
</Filter>));

...

const OrderList = ({ classes, ...props }) => (
<List
    {...props}
    filterDefaultValues={{ status: 'ordered' }}
    sort={{ field: 'date', order: 'DESC' }}
    perPage={25}
    filters={<OrderFilter />}
>
    <StyledTabbedDatagrid />
</List>
);

但是，我不知道要向ReferenceManyField添加相同的功能。例如，在演示网站中，这将是客户“编辑”组件的“订单”选项卡。是否可以为ReferenceManyField配置筛选器组件？

Answer 1

可能您已经找到了正确的答案，但是对于那些仍然存在此问题的人。这是一个简单的解决方案。只需在ReferenceManyField中使用列表即可。

const MyFilter = (props) => (
    <Filter {...props}>
        <ReferenceInput
            label="MyFilter"
            source="wallet"
            reference="wallets"
            sort={{ field: 'name', order: 'ASC' }}
            filterToQuery={searchText => ({ name: searchText })}
            allowEmpty={true}
            alwaysOn
        >
            <AutocompleteInput optionText="name" />
        </ReferenceInput>
    </Filter>
);

<ReferenceManyField
    label={false}
    reference="wallets"
    target="user"
>
   <List filter={{ user: record.id}} filters={<MyFilter />}>
      <Datagrid {...props}>         
         <ReferenceField source="vendor" resource="vendors" reference="vendors">
            <TextField source="name"/>
         </ReferenceField>
      </Datagrid>
   </List>
</ReferenceManyField>