はてなブックマーク

はじめに 仕事で Next.js のページ上でページ遷移時の確認モーダルを出すコードを作成したのでその上で知ったことに関して備忘録代わりにこちらで記載しておきます。 useEffect の理解 今回の目的の達成のために、Next.js の useEffect を用いようと思います。 useEffect は引数に指定した関数の実行をコンポーネントのレンダリング後に行うことができるメソッドです。 基本的なつくりは useEffect(関数, データ配列) となっており、第二引数の配列内のデータが更新されるたびに、第一引数の関数が実行されます。 今回の目標は「ページ遷移時の確認モーダル表示」なので、コンポーネントがアンマウントされたタイミングでの処理についても気を付ける必要があります。 その為、アンマウントされたタイミングでの処理も含めての基本的な構文は以下の様になります。 ページ遷移時の確認モ