Next.jsのApp Routerでブログの任意の記事数で分割された目次ページが作りたかったので調べたメモ
やりたいこと
分割された目次ページをNextに作ってもらって、作られたページへのリンクを利用すればいい(ダイナミックルーティングというらしい)。
ちなみにやりたいこと自体はページネーションっていうらしい。
やること
- (例えば)blogs/[id]というディレクトリを作って、その中にpage.tsxを作る。
- そのファイルの中でgenerateStaticParams()という関数を書く。
- 2の関数の戻り値で{id: string}の配列を返す(と、そのidの中身が[id]に入った名前のファイルができる(例: blogs/1.html))。
- 1のファイルの中で、表示したいページ(export default function ...)を書く。このとき、引数で{params}を受け取る(と、{params :{id: string}}型のオブジェクトから2で作ったこのページのパスID(例:1)が取り出せるのでプログラミングできる)。
出たエラー
"... is missing "generateStaticParams()" so it cannot be used with "output: export" config."が、この関数を書いてあるのに出てきた
↑この関数が中で呼んでる他の関数がバグくてページが生成できてないだけだった。