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

Question

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

例如，我有一个这样的输入：

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

当 Redux 表单选择它时，它只会给我一个真/假，即使我想要值“页面丢失或乱序”

我可以做这样的事情来到达我需要去的地方，以便在表单提交时，它会提交值“页面丢失或乱序，而不是真/假？

<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

您需要使用这两个的格式属性从字符串映射到布尔和规范化属性从布尔值映射到字符串。

例如，

如果你有保存Redux的状态，需要加以字符串数据'1'或者'0'，你需要使用一个<Field />类似下面映射到true与false该的默认值Redux的形式复选框

<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映射到'1'和'0'你的终极版商店。