reactjs - 如何在 final-form 和 Material UI (v1) 中做嵌套对象？

Question

我希望提交时的最终表单对象看起来像这样

{
  name : 'kk'
  address: {
      street: '123 abc',
      city: 'sf'
   }
}

我该怎么做？我知道我可以使用点语法并做同样的事情

<Field name="name" component="input"/>
<Field name="address.street" component="input"/>
<Field name="address.city" component="input"/>

但我想允许自由形式按钮添加key: value或删除它们，类似于代码框示例

我看到了一个示例，可以为我想做类似但对象而不是数组的数组执行此操作。

我想做一个对象生成器，就像上面的例子一样。

我正在使用 Material UI V1 beta 23 Final form和react final form最新版本

score 0 · Accepted Answer

您可以将用户添加的字段保持在表单的状态中，并动态呈现它们：

{this.state.fields.map(f => (
  <Address name={f.name} label={f.name} />
))}

1 回答 1