首页 > 解决方案 > Redux-form 未格式化帖子数据和 [object Object] 问题

问题描述

我有两个问题是彼此造成的。我用数据填充两个字段,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"
  ]
}

这是代码框 - https://codesandbox.io/s/8kzw0pw408

标签: javascriptreactjsreact-reduxredux-form

解决方案


试试这个:

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>
    );

推荐阅读