使用 React.js 一段时间后的状态变化

Question

我有一个在 false 和 true 之间切换的变量作为状态（我们可以称之为已提交）。我想做的是在几秒钟后将状态设置为true后将状态更改回false。我该怎么做？

我有一个在单击按钮时调用的函数，并且状态发生变化：

saveAndContinue: function(e) {
    e.preventDefault()

    if(this.state.submitted==false) {
        email = this.refs.email.getDOMNode().value
        this.setState({email: email})
        this.setState({submitted: !this.state.submitted});

    }

  }

我想补充一点，我有一个计时器将提交的变量设置为 false。我该怎么做呢？

Answer 1

您可以设置超时以在给定时间后重置状态。记得要bind(this)到超时函数，这样this就指向右边的this

saveAndContinue: function(e) {
    e.preventDefault()

    if(this.state.submitted==false) {
        email = this.refs.email.getDOMNode().value
        this.setState({email: email})
        this.setState({submitted: !this.state.submitted});
        setTimeout(function(){
             this.setState({submitted:false});
        }.bind(this),5000);  // wait 5 seconds, then reset to false
   }
}