我有两个互相导致的问题。我用initialValue
数据填充了两个字段,然后可以将另一个字段推到数组中。当我尝试从以下位置修改initialValue
结构时,就会出现问题:
initialValues: {
rockSingers: [ "Axl Rose", "Brian Johnson"]
}
收件人:
initialValues: {
rockSingers: [{ singer: "Axl Rose" }, { singer: "Brian Johnson" }]
}
第一个问题是该字段现在返回[object Object]
。提交表单后,将显示正确的json
格式,直到出现第二个问题为止……添加与initialValue
数据格式不同的新值时,例如
{
"rockSingers": [
{
"singer": "Axl Rose"
},
{
"singer": "Brian Johnson"
},
"Tom Rudge"
]
}
答案 0 :(得分:1)
尝试一下:
const renderRockSingers = ({ fields }) => (
<div>
<h3>Rock Singers:</h3>
{fields.map((rockSinger, index) => (
<div>
<Field
name={rockSinger}
format={value => value.singer}
parse={value => ({ singer: value })}
key={index}
component="input"
/>
</div>
))}
<button type="button" onClick={() => fields.push({ singer: '' })}>
Add more
</button>
</div>
);
答案 1 :(得分:1)
修改renderRockSingers
,以便获取对象而不是字符串。
const renderRockSingers = ({ fields }) => (
<div>
<h3>Rock Singers:</h3>
{fields.map((rockSinger) => (
<div>
<Field name={`${rockSinger}.singer`} key="index" component="input" />
</div>
))}
<button type="button" onClick={() => fields.push()}>
Add more
</button>
</div>
);
有关FieldArray
组件的更多信息,这里:fieldarrays
答案 2 :(得分:1)
<Field
name={rockSinger}
key={index}
component="input"
format={(value, name) => (value !== undefined ? value.singer : "")}
normalize={value => ({ singer: value })}
/>