Reactjs 具有自创建输入的Redux表单

我正在尝试创建一个redux表单（使用redux表单），它可以动态地创建自己的输入。我很难弄清楚如何让redux表单知道已经创建的新字段。是否可以动态更改redux表单在表单组件本身中传递的字段？我想错了吗？这就是我的工作

class AddCustomer extends Component {

 render() {

  class Form extends Component {

    constructor(props, context) {
      super(props, context)
      this.state = {
        inputsToAdd: []
      };
    }

    handleAddInput() {
       let inputsToAdd = this.state.inputsToAdd.slice();
       inputsToAdd.push(this.state.inputsToAdd.length);
       this.setState({ inputsToAdd });
    }

    submitForm(data) {
       console.log(data)
       this.setState({inputsToAdd: []});
       this.props.dispatch(initialize('addCustomer', {}))
    }

    render() {
      const { fields, handleSubmit } = this.props;
      return (
          <div>
            <form onSubmit={handleSubmit(this.submitForm.bind(this))}>
              <Input type='text' label='Company name' {...fields['companyName']}/>
              <Input type='email' label='Admin user email' {...fields['adminEmail']}/>
            </form>
            {this.state.inputsToAdd.map((element, index) => {
              return (
                <Input key={index} type='text' />
              )
            })}
            <Button onClick={() => this.handleAddInput()}>Add Input</Button>
            <Button onClick={handleSubmit(this.submitForm.bind(this))}>Submit</Button>
          </div>
        )
      }
    }

    Form = connectReduxForm({
      form: 'addCustomer',
      fields: ['companyName', 'adminEmail']
    })(Form);

    return (
      <div>
        <h1>Add Customer</h1>
        <Form />
      </div>
    )
  }
}

class AddCustomer扩展组件{
render（）{
类形式扩展组件{
构造函数（道具、上下文）{
超级（道具、背景）
此.state={
inputsToAdd:[]
};
}
handleAddInput（）{
让inputsToAdd=this.state.inputsToAdd.slice（）；
push（this.state.inputsToAdd.length）；
this.setState（{inputsToAdd}）；
}
提交表格（数据）{
console.log（数据）
this.setState（{inputsToAdd:[]}）；
this.props.dispatch（初始化（'addCustomer'，{}））
}
render（）{
const{fields，handleSubmit}=this.props；
返回(
{this.state.inputsToAdd.map（（元素，索引）=>{
返回(
)
})}
this.handleAddInput（）}>添加输入
提交
)
}
}
Form=connectReduxForm({
表格：'addCustomer'，
字段：['companyName'，'adminEmail']
})（表格）；
返回(
添加客户
)
}
}

从Redux表单6开始。*您可以使用

请参见下面的示例（摘自Redux文档并稍微简化）

从“React”导入React
从“redux form”导入{Field，FieldArray，reduxForm}
从“./validate”导入验证
常量renderMembers=（{fields，meta:{toucted，error}}）=>(


fields.push（{}）}>添加成员
{触摸&&error&&{error}

{fields.map（（成员，索引）=>

字段。删除（索引）}/>
成员#{index+1}

)}

)
const FieldArraysForm=（道具）=>{
const{handleSubmit，submiting}=props
返回(
提交
)
}
导出默认reduxForm({
表单：“fieldArrays”，//此表单的唯一标识符
验证
})（现场表格）

有关更多信息，请查看文档