动态获取redux表单的字段

时间:2016-08-29 20:34:06

标签: javascript forms field redux-form

我使用Redux Form和React,但表单字段需要硬编码。有没有办法从父组件动态传递字段?

/* form.jsx */

import React, { PropTypes } from 'react';
import { Field, reduxForm } from 'redux-form';

export const formFields = [
  'firstname',
  'lastname',
  'password'
]

class RegForm extends Component {
...
}

export default reduxForm({
    form: 'userForm',
    fields: formFields
})(RegForm);

以下是使用redux表单的父组件。

/* parent.jsx */
import RegForm from './RegForm';

...
<RegForm dynamicFields={some-dynamic-fields}>
...

如果redux表单使用硬编码字段(formFields),则工作正常。但是如果我改成它,

export default reduxForm({
    form: 'userForm',
    fields: this.props.dynamicFields
})(RegForm);

它不会起作用,并且说'#34;无法读取未定义的...&#34;

关于如何将动态字段传递给redux表单的任何想法?

提前致谢。

1 个答案:

答案 0 :(得分:1)

我明白了。动态字段将在实际表单组件本身中传入和接收。在这种情况下,类RegForm。其中,this.props.fields是从其父组件传入的字段。