useSWRInfiniteでinitialDataが認識されない現象が発生
Next.jsでの無限スクロール機能を実装したい場合、useSWRInfiniteを使うと手軽に実装できる。
また、getStaticPropsで初期ページのAPIレスポンスを取得し、useSWRInfiniteの initialData にAPIレスポンスを指定しておくと、初回ページ読み込み時のclient側でのAPIアクセスをなくすことができる。
「Load More」ボタンが押されたタイミングで setSize を設定することで次のページ読み込みが実行される。
setSize((prevSize) => prevSize + 1)が、swr@0.3.9を使っていた際にinitialDataを指定しているにも関わらず、「Load More」を押しても次のページ分が読み込まれない現象が発生した。
実装コードを見直しても変化がなかったので、試しに最新版のswr@0.3.11にアップデートしたところ正しい挙動になった。
yarn add swrライブラリのアップデートは大事。