阵营和终极版表格 - 防止重复请求表单时，第一个请求没有解决尚未

Question

我在那里，如果我点击提交Redux的形式（第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); 
... 

Answer 1

你onSubmit函数返回一个promise。

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