Javascript 在一个按钮上单击一次,我想渲染整个组件?

Javascript 在一个按钮上单击一次,我想渲染整个组件?,javascript,reactjs,antd,dynamic-forms,Javascript,Reactjs,Antd,Dynamic Forms,我正在尝试添加行程,单击“添加另一天”按钮后,我需要表单的精确副本 复制这个复选按钮应该从上面的表单复制完全相同的值 我使用了ant设计表单组件,并在dynamicForm组件的帮助下。我想要与下面第二幅图中相同的输出。直到我完成的第一张图片。现在,当我单击“添加另一个”按钮时,需要触发相同的表单 add = () => { const { form } = this.props; const keys = form.getFieldValue('keys');

我正在尝试添加行程,单击“添加另一天”按钮后,我需要表单的精确副本 复制这个复选按钮应该从上面的表单复制完全相同的值

我使用了ant设计表单组件,并在dynamicForm组件的帮助下。我想要与下面第二幅图中相同的输出。直到我完成的第一张图片。现在,当我单击“添加另一个”按钮时,需要触发相同的表单

add = () => {
    const { form } = this.props;
    const keys = form.getFieldValue('keys');

    // eslint-disable-next-line react/no-access-state-in-setstate
    this.setState({ id: this.state.id + 1 });
    const nextKeys = keys.concat(this.state.id);

    form.setFieldsValue({
      keys: nextKeys
    });
  };

  render() {
    const { getFieldDecorator, getFieldValue } = this.props.form;

    getFieldDecorator('keys', { initialValue: [] });
    const keys = getFieldValue('keys');
    const formItems = keys.map(k => (
      <Form.Item required={false} key={k}>
        {getFieldDecorator(`names[${k}]`, {
          rules: [
            {
              type: 'array',
              required: true,
              message: 'Please select date!'
            }
          ]
        })(<RangePicker className={styles.calendar} format="YYYY-MM-DD" placeholder={['Start date', 'End date']} />)}
        {keys.length >= 1 ? (
          <Icon className={styles.dynamic_delete_btn} type="minus-circle-o" onClick={() => this.remove(k)} />
        ) : null}
      </Form.Item>
    ));

 <Button onClick={this.addNewPckHighlightsTxtArea} className={styles.btn_add_another_day}>
                <FormattedMessage id="app.package.add.day" />
              </Button>

add=()=>{
const{form}=this.props;
const keys=form.getFieldValue('keys');
//eslint在setstate中禁用下一行反应/无访问状态
this.setState({id:this.state.id+1});
const nextKeys=keys.concat(this.state.id);
form.setFieldsValue({
钥匙:下一个钥匙
});
};
render(){
const{getFieldDecorator,getFieldValue}=this.props.form;
getFieldDecorator('keys',{initialValue:[]});
常量键=getFieldValue(“键”);
常量formItems=keys.map(k=>(
{getFieldDecorator(`names[${k}]`{
规则:[
{
键入:“数组”,
要求:正确,
消息:“请选择日期!”
}
]
})()}
{keys.length>=1(
这个。删除(k)}/>
):null}
));

如果您想再次复制相同的元素,只需React.createElement(“指定的组件或元素”)并将此元素附加到数组中。

您的问题在哪里?你预计会发生什么?发生了什么事?您会收到什么错误消息
render(){…
似乎是语法错误。我希望与第二幅图中的完全一样。上面的代码只是我尝试执行的部分代码。之前没有任何错误,但无法实现目标。这是我所做的代码链接。