倒计时

作者: 栗子daisy | 来源:发表于2019-11-05 17:06 被阅读0次
    constructor(props) { 
    super(props);
     this.state = { time: 60, disabled: false, }; 
    } 
    countDown = () => { 
    let time = this.state.time;
     if (time === 1) { 
    this.setState({ disabled: false, time: 60, });
     } else { 
    clearInterval(this.Timer);
     this.setState({ disabled: true, time: time - 1, }); 
    this.Timer = setTimeout(this.countDown.bind(this), 1000); 
    } }; 
    handleClick = () => { this.countDown(); }; 
    resetClick = () => { 
    clearInterval(this.Timer); 
    this.setState( { disabled: false, time: 60, }, () => this.countDown() ); 
    }; 
    render() { 
    return (
    <div>
            <button type="primary" disabled={this.state.disabled} onclick={this.handleClick}>
              {this.state.time}
            </button>
            <button type="primary" onclick={this.resetClick}>
              reset
            </button>
          </div>
    )};
    

    相关文章

      网友评论

          本文标题:倒计时

          本文链接:https://www.haomeiwen.com/subject/qclebctx.html