Redux-Form 可重复字段

Question

我正在使用 Redux-Form v.5.2.3。我有一个文本输入需要重复 x 次，具体取决于用户单击按钮的次数。目前，因为我正在生成具有相同字段名称的相同输入字段，所以它不起作用。当我在一个输入上键入内容时，它会自动在其他输入中键入相同的内容——这是因为名称相同。

我正在考虑生成一个唯一 ID 并将其附加到字段 'name' - 例如：

原始字段：

姓名：<input type="text" {...name}>

第二个字段 - 按下按钮后生成：

姓名：<input type="text" {...name2}>

X 字段 - 在按下 x 按钮后生成：

姓名：<input type="text" {...nameX}>

任何想法是否有效以及如何实施的示例？

提前致谢

Answer 1

我会在 RF 文档中查看 deep forms。

也在尝试解决这个问题，但据我了解，您可以使用 [] 表示法定义一个字段数组。

export const fields = [
  'name[]',
];

然后使用 addField(value?, index?) 添加其他字段。然后，您可以通过将 this.props.fields.name 视为 name 字段的数组来访问每个字段。

对于你的情况，我认为它应该类似于

<div>
  {this.props.fields.name.map((field, index) => (
    <input key={index} type="text" {...field} />
  )}
</div>

Answer 2

您可以将 redux-from v6.0.0. In this version you can use FieldArray 用于数组字段。

Redux-Form repeatable field