タグ

ブックマーク / qiita.com/yuta4j1 (1)

  • useEffect内でsetTimeoutを使用する時の注意 - Qiita

    TL;DR useEffect内でsetTimeoutを使用するときは、ちゃんとクリーンアップ処理を書きましょう。 useEffect(() => { let timeoutId = setTimeout(() => { // 5秒経過したら閉じる setIsOpen(false) }, 5000) // こういう処理を書く + return () => { + clearTimeout(timeoutId) + } }, []) クリーンアップ処理がないと起こりうるつらさ コンポーネント状態が更新され、かつその状態がsetTimeoutの設定に依存している場合、意図しない動きをするケースがあるからです。 例えば数秒待機して自動で閉じるモーダルを実装するとします。 この場合、コンポーネントの実装としては以下のようになるかと思います。 const Modal = () => { const

    useEffect内でsetTimeoutを使用する時の注意 - Qiita
  • 1