Next.js 便利だけど、罠多し
React + React Router の構成に慣れている人が Next.js 触ると、特に routing 周りで「え...」となることが多い。
どこで困ったか、メモしておく。
- URL パラメータの値が最初のレンダリング時に
undefinedになる
普通に辛い。
pages/detail/[id]/index.tsx のようなページにおいて、id の値を取得しようとすると、最初のレンダリング時には undefined になるので、そのための処理を書いておかないといけない。
まぁ、なんか最適化のために犠牲になった側面なのだろう。。理解はできるが...
別の Qitta 記事もあったので、ご参考に。
-
history.stateが使えない
公式のドキュメントを見る感じ、サポートがない。これに関しては、hack（URL に露出させずに query として渡す方法）を見つけたので、別で記事にしたい。
また出てきたら追記する。