Ant Design分步表单传参问题

1、第一步表单中验证问题:

const onValidateForm = () => {
      let fileInfo = this.props.form.getFieldsValue();
      //console.log('fileInfo', fileInfo);
      sessionStorage.setItem('fileInfo', JSON.stringify(fileInfo));
      validateFields((err, values) => {
        if (!err) {
          dispatch({
            type: 'file/saveStepFormData',
            payload: fileInfo,
          });
          router.push('/file/step-form/confirm');
        }
      });
    };

2、第二步表单中接收第一步表单中传过来的参数,提交表单

const onValidateForm = e => {
      const fileListInfo = sessionStorage.getItem('fileInfo');
      console.log('fileListInfo', fileListInfo, JSON.parse(fileListInfo));
      const dataInfo = JSON.parse(fileListInfo);

      const envName = dataInfo.envName;
      //console.log('dataInfo', dataInfo.dbIpPort);
      const dbName = dataInfo.dbName;
      const dbTableNames = dataInfo.dbTableNames;
      const sql = dataInfo.sql;

      let fileList = this.props.form.getFieldsValue();
      const projectName = fileList.projectName;
      const createDaoImpl = fileList.createDaoImpl;
      const extendsBaseEntity = fileList.extendsBaseEntity;
      const extendsBaseDao = fileList.extendsBaseDao;

      e.preventDefault();
      validateFields((err, values) => {
        if (!err) {
          dispatch({
            type: 'file/submitStepForm',
            payload: {
              envName,
              dbName,
              dbTableNames,
              sql,
              

              projectName,
              createDaoImpl,
              extendsBaseEntity,
              extendsBaseDao,
            },
          });
        }
      });
    };

3、 页面展示如下:

猜你喜欢

转载自blog.csdn.net/zjq_1234/article/details/90202237