如何使用 ArrayInput 在 react-admin 列表视图中填充数据答案

【问题标题】：How to use ArrayInput to populate data in react-admin list view如何使用 ArrayInput 在 react-admin 列表视图中填充数据
【发布时间】：2021-02-26 13:54:53
【问题描述】：

我有一个 react-admin Create 视图，我想使用 ArrayInput 显示和填充它，但它似乎忽略了列表中的数据。

我尝试加载数据

const { data } = useQueryWithStore({
    type: 'getList',
    resource: 'comments',
});

并手动为其设置源，但ArrayInput 似乎对向其提供一些数据的所有努力都不感兴趣。

我可以遍历数据数组并渲染TextFields 并相应地删除按钮，同时留下ArrayInput 添加新数据，但这违背了目的和与ArrayInput 的美妙交互。有什么我想念的吗？我应该如何传递数据以使其按预期工作？我为这个HERE做了一个沙盒例子@

【问题讨论】：

你的问题不是很清楚你想要达到的最终结果是什么。但我注意到的是 - 您在 List 组件中使用 SimpleForm。这完全不是预期的用法或行为。 SimpleForm 需要一个创建/编辑父组件。而 List 需要一个 Datagrid 或另一个迭代显示组件
感谢您的评论。如果我在创建视图中使用 ArrayInput 没有区别。 ArrayInput 似乎不能作为表单顶层的输入组件，而仅适用于实体关系。最终结果应该是我可以单独使用 ArrayInput 创建实体（使用其“+”按钮添加新实体并通过保存表单来创建它们）。
它确实按照预期的方式工作，并且确实在顶层工作。通过提交一份表单，您只能创建一个新实体。您所关注的是批量创建操作，但您必须针对该操作提出自定义实现。

标签： reactjs bulkinsert react-admin react-final-form react-final-form-arrays

【解决方案1】：

要使用一个 form 提交创建多行实体，您需要自定义实现或解决方法。

最简单的方法之一是手动处理表单的提交、更改数据并为每个输入的实体发送单独的请求。

Here in the docs 显示了一个示例，您可以将Create 视图传递给自定义toolbar，您可以在其中实现您的逻辑。

【讨论】：