亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

當我按空格鍵停止秒表時,它從 0 重新開始并開始加速

當我按空格鍵停止秒表時,它從 0 重新開始并開始加速

慕婉清6462132 2022-11-11 16:10:25
這是我的程序。我用開始和停止按鈕創建了秒表,一切正常。我的下一步是讓秒表通過空格鍵對鍵盤做出反應。當我按下開始按鈕時,秒表開始運行。當我按下空格鍵時,秒表并沒有停在當前位置,而是從 0 處重新開始并開始快速計數。停止按鈕正常工作。import React from 'react';class Home extends React.Component {    constructor(props) {        super(props);        this.state = {milliSecondsElapsed: 0};        this.handleStopClick = this.handleStopClick.bind(this);        this.keyPress = this.keyPress.bind(this);            }    keyPress = (e) => {        if (e.keyCode == 32){            handleStopClick();        }    }    getMilliseconds() {        return ("0" + this.state.milliSecondsElapsed).slice(-2);    }    // var number = this.state.milliSecondsElapsed.toString().length;    getSeconds() {        var milli = this.state.milliSecondsElapsed;        var seconds = 0;        seconds = milli / 100;        var myTrunc = Math.trunc(seconds);        myTrunc = myTrunc % 60;        return ("0" + myTrunc).slice(-2);    }    getMinutes() {        var milli = this.state.milliSecondsElapsed;        var seconds = 0;        var minutes = 0;        seconds = milli / 100;        minutes = seconds / 60;        var myTrunc = Math.trunc(minutes);        return ("0" + myTrunc).slice(-2);            }    handleStartClick = () => {        this.setState({            milliSecondsElapsed: (0)        });        this.timer = setInterval(() => {            this.setState({                milliSecondsElapsed: (this.state.milliSecondsElapsed + 1)            });        }, 10)    }    handleStopClick = () => {        clearInterval(this.timer);    }有誰看到可能導致這種情況的原因?
查看完整描述

2 回答

?
翻過高山走不出你

TA貢獻1875條經驗 獲得超3個贊

您將keyPress回調附加到onKeydown輸入,但是當您單擊開始按鈕以啟動秒表時,該按鈕仍然具有焦點。擊中空間只是再次開始,這就是它“重置”計時器并開始變得更快的原因,你沒有清除以前的間隔,所以它們繼續運行。如果您將焦點轉移到輸入然后點擊空格,它會按預期工作。


在計時器開始時禁用開始按鈕有助于不開始新的間隔。


<button

  disabled={this.state.milliSecondsElapsed}

  type="button"

  onClick={this.handleStartClick}

>

  {" "}

  start{" "}

</button>


查看完整回答
反對 回復 2022-11-11
?
GCT1015

TA貢獻1827條經驗 獲得超4個贊

我認為你不能明確間隔。請檢查這個問題


查看完整回答
反對 回復 2022-11-11
  • 2 回答
  • 0 關注
  • 155 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號