如何动态地将对象添加到 react-final-form 字段名称？

Question

这个 react-final-form 组件会返回如下结果

<Field
   name="answers[0].name"
   component="input"
   type="radio"
   value="0"
/>


{ answers: [ { name: 'value' } ] } 

如何添加另一个属性？会这样结束

{ answers: [ { name: 'user input value will here', other: 'my custom data' } ] } 

根据最终形式，您可以通过 4 种方式命名您的字段组件

Answer 1

您可以向表单添加一个 initialValues 道具，该道具将预填充结果。

<Form
    onSubmit={onSubmit}
    initialValues={{
        answers: [ { other: 'your custom data' } ]
    }}
>
    <Field
        name="answers[0].name"
        component="input"
        type="text"
    />
</Form>