在 redux-from 的字段数组中使用 props

Question

我有一个包含字段数组的 redux 形式的无状态组件。我正在尝试确定如何将道具传递给包含的字段以填充 select 列表选项。

 const renderSoftwareForm = ({ fields, meta: { error, submitFailed }, props}) => (
  <ul style={{listStyle: "none", padding: "0"}}>
    <li>
      <button type="button" onClick={() => fields.push({})}>
        Add Line Item
      </button>
    </li>
    {fields.map((softwares, index) => (
      <li key={index}>
        <Row>
        <Col sm={1}>
          <Field
            label="Theme"
            name={`${softwares}.theme`}
            type="select"
            component={SelectComponent}
          >
            <option>test</option>
            {props.themes.data && props.themes.data.map(themes => (
              <option value={themes.prodLine} key={themes.prodLineId}>
                {themes.prodLine}
              </option>
            ))}
          </Field>
        </Col>
        </Row>
        <div style={{textAlign: "center"}}>
        <button type="button" onClick={() => fields.remove(index)}>
          Remove Line Item
        </button>
        </div>
        <div>
          <span>&nbsp;</span>
        </div>
      </li>
    ))}
  </ul>
)

const SoftwareForm = props => {
  const { handleSubmit, pristine, reset, submitting } = props
  return (
    <div>
      <FieldArray name="softwares" props={props} component={renderSoftwareForm} />
    </div>
  )
}

  export default SoftwareForm;

一切都适用于选项列表中的静态值。

我可以看到道具一直传递到 renderSoftwareForm，但它似乎在我的 Field 中不可用...我觉得我错过了一些简单的东西...props.themes.data returns 错误 --- 无法读取未定义的属性 'themes' ---... 如何在 FieldArray 字段中访问此道具？

谢谢！

Answer 1

<Field
            label="Theme"
            name={`${softwares}.theme`}
            type="select"
            component={SelectComponent}
            props={{
              themes: props.themes 
           }}
          >
            <option>test</option>
            {props.themes.data && props.themes.data.map(themes => (
              <option value={themes.prodLine} key={themes.prodLineId}>
                {themes.prodLine}
              </option>
            ))}
          </Field>

这样主题道具将在您选择组件中可用

在 redux-from 的字段数组中使用 props

Using props inside of a field-array in redux-from

ecmascript-6

reactjs

redux

redux-form

react-props