AutocompleteArrayInput显示空白条目

Question

我的数据库中有一个数组，我想使用react-admin进行CRUD。 AutocompleteArrayInput组件可以满足我的各种需求，但有一个方面。我遇到的问题是AutocompleteArrayInput不显示不是从提供给组件的选项的有限列表中的条目。如果选项列表中没有条目，则react-admin不会显示插入的自定义文本，而是不显示任何文本，例如：

请考虑以下示例：

Which colors do you like? Select all that apply

- Red
- Blue
- Green
- Other (write in your own)

示例数组包括：

• [“红色”]
• [“红色”，“绿色”]
• [“粉红色”]
• [“栗色”]

我将[“ Red”，“ Blue”，“ Green”]的数组传递给react-admin中的AutocompleteArrayInput。前两个示例显示正常，因为“红色”和“绿色”都在已知列表中。但是，问题是react-admin不显示“ Pink”或“ Maroon”文本，而是显示一个空条目。

是否需要更改设置，以使react-admin显示原始输入文本而不是仅显示空白？

示例代码：

const my_choices = [
  {id:'red', name:'red'},
  {id:'green', name:'green'},
  {id:'blue', name:'blue'}
];

export const ResourceEdit = (props) => (
  <Edit {...props} redirect="list">
      <SimpleForm>
          <AutocompleteArrayInput source="Colors" choices = {my_choices} allowEmpty />
      </SimpleForm>
 </Edit>
);

对于上面的示例，我希望为red，green和blue自动完成，但是如果数组中存在其他颜色，我希望能够看到它也可以在管理界面中，而不仅仅是将其显示为空白。

我是否缺少配置设置？如果可能的话，我想避免为组件提供详尽的选项列表。

环境

• 反应管理员版本：2.9.2
• 没有出现此问题的最新版本（如果适用）：未知
• 反应版本：16.8.6
• 浏览器：已在Chrome和Firefox上测试

Answer 1

添加属性optionText。

const choices = [
    { _id: 123, full_name: 'Leo Tolstoi', sex: 'M' },
    { _id: 456, full_name: 'Jane Austen', sex: 'F' },
];

<AutocompleteArrayInput source="author_id" choices={choices} optionText="full_name" optionValue="_id" />

https://marmelab.com/react-admin/Inputs.html#autocompletearrayinput

Answer 2

我遇到了同样的问题-原来我应该使用ReferenceInput时才使用ReferenceArrayInput。

即

<ReferenceInput
    ...
>
    <AutocompleteArrayInput
        ...
    />
</ReferenceInput>

...本来应该...

<ReferenceArrayInput
    ...
>
    <AutocompleteArrayInput
        ...
    />
</ReferenceArrayInput>