MENU

React における clearIntervalの利用の理解

内容

clearIntervalが何をしているのかわからなかった

結論

  • 別画面に行く時にsetIntervalをクリアしてくれる

コード

これは6秒ごとに triggerGetData関数を実行していて、 別画面に行く時、つまりコンポーネントがアンマウントされた時に、 clearIntervalしてくれる

これがないと別画面に行ってもtriggerGetData関数が実行されるんだろうな triggerGetData関数はAPIを叩いているのでこれがないと不要なリクエストが溜まっていくんだろうな

useEffect(() => {
    triggerGetData();
    const _intervalId = setInterval(() => {
      triggerGetData();
    }, 6000);

    return () => {
      clearInterval(_intervalId);
    };
  }, []);