javascript - React＆Redux-Form-当第一个请求尚未解决时，防止表单重复请求

我有一个问题，如果我很快两次单击redux-form（v.6）上的提交，它将发送两个操作，然后-> ajax请求到我的服务器，这将创建一个重复的请求。

在将表单中的条目保存到数据库中时，禁用“提交”按钮并在存储条目之后再次启用它的最佳方法是什么。我尝试了（disabled = {submitting}），但似乎无法在下面的示例中使用。没有太多的信息，所以我使用不正确吗？

class Timesheet extends Component {
...
  onSubmit(props) {
   console.log('submitting', props);
   createTimesheet(props);
  }


  render() {

    const {handleSubmit, reset, submitting} = this.props;

    return(
      <form onSubmit={handleSubmit(this.onSubmit.bind(this))}>
      ... form details
      <button type="submit" disabled={submitting} className="btn btn-primary">Submit</button>
      </form>
    )
  }
}

...

const TimesheetForm = reduxForm({
  form: 'TimesheetNewForm',
  enableReinitialize: true
}
, null, {createTimesheet})(Timesheet);
...

最佳答案

您的onSubmit函数应返回一个promise。

在这种情况下，在解决承诺之前，this.props.submitting将变为true。