【react-timer-hook】リセットボタンを押した時、自動で再スタートさせない方法

 

先日react-timer-hookというパッケージを使って、
ストップウォッチ機能を実装しました。

とても簡単に機能を実装できたのですが、
リセットボタンを押すと自動でストップウォッチがスタートされる問題にぶち当たり・・

再スタートさせないにはどうすればいいか?わりと迷走しました。
(たぶん、初学者だからだと思う)

解決方法について解説されている記事などが見つからなかったので、
こちらにメモしておきます。

導入方法や使用方法等はネットにたくさん情報があるので、
こちらでは割愛します。

公式ドキュメントはこちら↓
https://github.com/amrlabib/react-timer-hook

リセットしても自動でタイマーをスタートさせない方法

  • newDate関数で現在の時間を取得→変数に格納
  • reset関数を呼び出す時に、第一引数にnewDateの値を格納した変数、
    第二引数にfalseを渡してあげれば自動でスタートしません。
// resetFcをonClickに渡して、リセットボタンをクリックした時に実行する

const stopwatchOffset = new Date();
    const resetFc = () => {
      reset(stopwatchOffset, false)
    }

コメント

タイトルとURLをコピーしました