redux-form 中多选的初始值答案

【问题标题】：initialValues for multiple select in redux-formredux-form 中多选的初始值
【发布时间】：2018-05-17 15:08:42
【问题描述】：

我将选择元素定义为多个。我想将 initialValues 传递给 redux-form

     <Field 
          name="favoriteColor" 
          component="select"
          type="select-multiple"
          multiple >
            <option value="">Select a color...</option>
            {colors.map(colorOption => (
              <option value={colorOption.name} key={colorOption.name}>
                {colorOption.name}
              </option>
            ))}
      </Field>

CodeSandBox example

Redux-form 对诸如 favoriteColor: ['Blue', 'Green', ...] 之类的变化作出反应，但我需要 favoriteColor: [{name: 'Blue'}, {name: 'Green'}, .. .]。同样对于初始化它必须注意对象的名称字段

【问题讨论】：

你想将 intialValues 传递给 redux-form 吗？
实际上不是。我的 initialValues 看起来像 [ { name: 'Blue' }, { name: 'Yellow' } ]，所以我想显示选择了哪些选项，也以相同的结构发送给 BE

标签： reactjs redux redux-form

【解决方案1】：

使用lodash 处理表单的initialValues 属性上的数据。

https://codesandbox.io/s/318n0oy6xp

【讨论】：

我也可以使用 .map(item => item.name) 来实现。那是不对的。因为当我将数据发送到 BE 时，我需要做相反的事情。我正在寻找 redux-form 标准方式