Javascript 从对象中选中的redux表单字段和复选框react工具箱值

我有以下数据：

...
initialValues: {
  alarm: 'normal',
  days: { mon: true, tue: true, wed: true, thu: false, friday: true }
}
...

为了渲染，我执行以下操作

<Field name="days" component={({ input }) => {
  return (
    <div className='days-container'>
      <Checkbox label='Monday' checked={input.value.mon} onChange={input.onChange} />
      <Checkbox label='Tuesday' checked={input.value.tue} onChange={input.onChange} />
      ...
    </div>
  )
}}/>

正如您希望保持初始结构一样？

我是这样做的

<Field name="days" label='Days' component={({ input, label }) => {
  return (
    <div className='days-container'>
      <span className='label'>{label}</span>
      {[ 'mon', 'tue', 'wed', 'thu', 'friday'].map((name, index) =>
          <Checkbox label={name} checked={input.value[name]} key={index} onChange={checked => {
            const setter = {};
            setter[name]=checked;
            input.onChange({...input.value, ...setter})}} />
      )}
    </div>
  )
}}/>

{
返回(
{label}
{['mon'、'tue'、'wed'、'thu'、'friday'].map（（名称、索引）=>
{
常量setter={}；
setter[名称]=已选中；
input.onChange（{…input.value，…setter}}}/>
)}
)
}}/>

---

有更好的方法吗？

你可以编辑你知道的帖子吗？修改后，我没有看到编辑的选项。这真的很好。在我的例子中，我最终为redux表单创建了一个定制的reducer插件，并通过监听它的onclick事件来分别处理每个tickbox。。。这要容易得多。

<Field name="days" label='Days' component={({ input, label }) => {
  return (
    <div className='days-container'>
      <span className='label'>{label}</span>
      {[ 'mon', 'tue', 'wed', 'thu', 'friday'].map((name, index) =>
          <Checkbox label={name} checked={input.value[name]} key={index} onChange={checked => {
            const setter = {};
            setter[name]=checked;
            input.onChange({...input.value, ...setter})}} />
      )}
    </div>
  )
}}/>