Redux Form - 使用动态字段名称初始化状态

Question

我在尝试为表单上的某些字段设置默认值时遇到了一些问题。我遇到的问题是，由于它在 .map 函数内部，我需要有动态字段名称，并且当我尝试在我的 `mapStateToProps 中使用 intializeValues 时不知道应该如何命名它。

我的字段数组也在父组件的 FormSection 中。

我正在尝试为其设置默认值的字段。

{fields.map((table, index) =>

  <Field
    name={`${table}.leftStile`}
    type="text"
    component={renderField}
    label="leftStile"
  />
}

带有redux的父组件

---

 <FormSection name="dimensions">
   <OrderTable />
 </FormSection>

---

const mapStateToProps = state => ({
  form: state.form,
  submitted: state.Orders.submitted,
  initializeValues: {
  //problem naming here <-----
  }
});

const mapDispatchToProps = dispatch => bindActionCreators({
  addDoorOrder
}, dispatch);

DoorOrders = connect(
  mapStateToProps,
  mapDispatchToProps
)(DoorOrders);

export default reduxForm({
  form: 'Orders',
  enableReinitialize: true
})(DoorOrders);

Answer 1

如果您还可以提供演示组件DoorOrders，我将更新答案。以及fields 道具的形状或示例。
现在，我假设 fields 是一个 DoorOrders 道具，不是来自 redux 并且具有如下形状：

[
    { leftStile: "firstName", initialValue: "John" },
    { leftStile: "lastName", initialValue: "Doe" },
    //...
]

您可以在 mapStateToProps 函数中作为第二个参数访问这些道具：

import { fromPairs } from "ramda"

//...

const mapStateToProps = (state, ownProps) => ({
   form: state.form,
   submitted: state.Orders.submitted,
   initializeValues: R.fromPairs( // <= see below
       ownProps.fields.map(table => [table.leftStile, table.initialValue])
   )
});

//...

我正在使用ramda's fromPairs 将[[a, b], [c, d]] 转换为{ a: b, c: d }，因为我喜欢它，但是像lodash 这样的其他库可以实现这一点（或香草javascript）。

我希望这会有所帮助。