Ошибка в моем коде секундомера реакции. Проблема с clearInterval ()? - PullRequest
0 голосов
/ 14 июля 2020

Я пытался создать простое приложение для секундомера на React. Приложение работает нормально, но кнопки остановки и очистки не работают. После запуска таймер будет продолжать работать.

Я уже некоторое время стучу головой по клавиатуре с этим. Любая помощь приветствуется.

Спасибо.

class Stopwatch extends Component {
    state = {
      status: false,
      runningTime: 0
    };

    handleClick = () => {
      this.setState(state => {
        if (state.status) {
          clearInterval(this.timer);
        } else {
          const startTime = Date.now() - this.state.runningTime;
          this.timer = setInterval(() => {
            this.setState({ runningTime: Date.now() - startTime });
          });
        }
        return { status: !state.status };
      });
    };
    handleReset = () => {
        clearInterval(this.timer);
        this.setState({ runningTime: 0, status: false });
      };

    componentWillUnmount() {
        clearInterval(this.timer);
      }

    render() {
      const { status, runningTime } = this.state;
      return (
        <div>
          <p>{runningTime}ms</p>
          <button onClick={this.handleClick}>{status ? 'Stop' : 'Start'}</button>
          <button onClick={this.handleReset}>Reset</button>
        </div>
      );
    }
  }

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...