如何解决React-admin ReferenceArrayInput AutocompleteArrayInput 组件不显示预先选择的项目标签
<Edit {...props} transform={transform}>
<SimpleForm>
...
<ArrayField source="sites" label="Selected Sites" fieldKey="id">
<SingleFieldList key="2" linkType={false}>
<ChipField source="siteName" />
</SingleFieldList>
</ArrayField>
<ReferenceArrayInput
source="sites"
reference="site"
fieldKey="siteName"
required={true}
validate={[required()]}
>
<AutocompleteArrayInput
source="id"
optionText="siteName"
setFilter={(filter) => {
return {
siteName: filter
}
}} />
</ReferenceArrayInput>
</SimpleForm>
</Edit>
问题在于 ReferenceArrayInput -> AutocompleteArrayInput 未显示从 GET /sites/:id api 调用返回的已选择 sites
,其输出如下:
{
"createdAt": "2021-07-20T10:06:42.306Z","updatedAt": "2021-07-20T10:06:42.306Z","deletedAt": null,"id": 4,"clientName": "Hank Carter","addressId": 16,"sites": [
{
"createdAt": "2021-07-20T10:05:49.950Z","updatedAt": "2021-07-20T10:05:49.950Z","id": 3,"siteName": "SITE =","addressId": 3,"address": {
"createdAt": "2021-07-20T10:05:49.605Z","updatedAt": "2021-07-20T11:36:16.236Z","addressLine1": "xxxx Circle","addressLine2": "0036 Hickle View","addressLine3": "a","addressLine4": "Lonniesidexxxx","postCode": "13340520","provinceOrRegion": "Pennsylvania","town": "Jaceyview","countryId": 238
}
},{
"createdAt": "2021-07-20T10:06:42.263Z","updatedAt": "2021-07-20T10:06:42.263Z","siteName": "MacGyver,Christiansen and Zemlak","addressId": 15,"address": {
"createdAt": "2021-07-20T10:06:42.023Z","updatedAt": "2021-07-20T10:06:42.023Z","id": 15,"addressLine1": "Miracle Lodge","addressLine2": "09669 Lynch Garden","addressLine4": "Warrenport","postCode": "44707-5399","provinceOrRegion": "Mississippi","town": "East Rahsaanfort","countryId": 250
}
}
],"address": {
"createdAt": "2021-07-20T10:06:42.068Z","updatedAt": "2021-07-20T15:13:09.886Z","id": 16,"addressLine1": "Ashleigh Burgs","addressLine2": "07719 Betsy Trace","addressLine3": "c","addressLine4": "Aliyaburgh","postCode": "ABC123","provinceOrRegion": "Mainddd","town": "Kossburghdd","countryId": 235,"country": {
"createdAt": "2021-07-20T10:03:22.843Z","updatedAt": "2021-07-20T10:03:22.843Z","id": 235,"countryName": "United Kingdom","countryCode": "GB"
}
},"users": []
}
请注意以下事项
- ArrayField -> SingleFieldList -> ChipField 正确显示所选站点名称标签
- ReferenceArrayInput -> AutocompleteArrayInput 不显示所选站点标签,但它保存它们的 ID,因此在保存记录时,关系也会正确保存。
- 如果我想向现有的项目添加额外的项目(不带标签),可以很好地过滤相关网站,并且当我选择一个时,标签也会被添加。看截图@https://imgur.com/zKi9j9D.png
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。