Redux-Form可重复字段

Redux-Form repeatable field

本文关键字：字段 Redux-Form      更新时间：2023-09-26

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

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

原始字段:

名称:<input type="text" {...name}>

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

名称:<input type="text" {...name2}>

X字段-按下X按钮后生成:

名称:<input type="text" {...nameX}>

任何想法，如果这工作和一个例子如何实现?

Thanks in advance

我会在RF文档中查看深度表单。

试着弄清楚这一点，但从我的理解，你可以通过使用[]符号来定义字段数组。

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>

您可以使用redux-from v6.0.0。在这个版本中，你可以使用FieldArray数组字段

相关文章：