redux-form 中多选的初始值

Posted 2023-02-19

【中文标题】redux-form 中多选的初始值

【英文标题】：initialValues for multiple select in redux-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

【参考方案1】：

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

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

【讨论】：

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