使用redux-form

Question

简介

我有一个可切换项目列表（复选框）。每个项目可能有额外的数据字段。这是服务器使用的模式（请求，响应）：

{
  medications: [
    {
      id: 'med1',
    },
    {
      id: 'med5',
      dosage: {
        units: 'mg',
        amount: 5
      }
    }
  ]
}

• 一个值应该是一个对象数组
• 每个对象可能还有一个带有额外字段的附加对象属性
• 切换时应保存额外属性的状态

问题

使用redux-form实现与上面显示的数据模式完美配合的表单的最佳方法是什么？无需将两个独立对象（选定的单选按钮组）中生成的对象数组合在一起。

有比下面的解决方法更优雅的方法吗？

使用我当前的实现，redux-form将medications存储为ID的对象作为键，将true / false存储为值，我必须在初始化表单并转换它时将数组转换为对象在发送到服务器之前返回数组。虽然剂量存储为单独的Form字段，但我需要将药物与剂量相匹配，并将它们组合成上面显示的单个对象数组。这样的解决方案有效，但不优雅，增加了不必要的复杂性

＆＃34;解决方法的示例＆＃34;使用FieldArrays

最近我能够使用FieldArrays实现我需要的东西。这完全是我需要的，但需要一些努力来保存取消选择的项目的数据以及手动存储＆＃34;选择项目以避免在显示＆＃34;已检查＆＃34;时出现性能问题状态。

这种方法更加优雅，不需要在表单编辑之前/之后进行转换。并且可以将另外的切换/状态逻辑分离为HOC组件。我唯一不喜欢的是我通过手动推送/删除fieldArray中的元素来切换到手动跟踪无线电输入状态（选中/取消选中）。

链接：https://codesandbox.io/s/jzjnjm4x3