我如何使用 Redux-form 从复选框中获取值？

Question

如何将 redux 表单中复选框的默认布尔值更改为您在输入本身上指定的值？

例如，我有这样的输入：

<input type="checkbox" value="Pages missing or out of order" {...issue1} />

当 Redux 表单选择它时，它只给了我一个 true/false，即使我想要值 "Pages missing or out of order"

我可以做这样的事情来到达我需要去的地方，以便在提交表单时，它会提交值“Pages missing or out of order，而不是 true/false?

<input type="checkbox" onChange={value => console.log(value.target.value)} value="Pages missing or out of order" />

当我删除 {...issue1} 时，我的自定义 onChange 事件处理程序将被调用，但当我保留 {...issue1} 时，它会被完全忽略。

想法？

Answer 1

否，redux-form 将复选框视为布尔值。您必须将布尔值映射到其他地方的字符串。

Answer 2

您需要使用 both format 属性从字符串映射到布尔值和 normalize 属性从布尔值映射到字符串。

例如，

如果你有数据保存在 redux 状态需要是字符串 '1' 或 '0'，你需要使用像下面的 <Field /> 来映射到 true 和 false redux-form 复选框的默认值

<Field
  name='myCheckbox'
  type='checkbox
  format={v => v === '1'} // converts redux state string to boolean
  normalize={v => v ? '1' : '0'} // converts checkbox boolean to string
/>

同时使用格式和规范化，您可以将复选框 true 和 false 映射到 redux 存储中的 '1' 和 '0'。

我如何使用 Redux-form 从复选框中获取值？

How do I use Redux-form to get values from checkboxes?

reactjs

redux

redux-form