英文:
Next.js 13 Dynamic Route: A required parameter (slug) was not provided as a string in generateStaticParams for /[lng]/blog/[slug]
问题
I'm working on a Next.js 13 project that requires internationalization support and a blog. Here is the structure of the app folder:
app
--[lang]
----blog
------page.tsx
------[slug]
--------page.tsx
The [lang] part is for links of different languages:
http://localhost/en/about
http://localhost/fr/about
The blog part is for the post list:
http://localhost/en/blog
(shows a list of all blogs)
The [slug] part is for the post detail:
http://localhost/en/blog/my-first-post
Before I add the [lang] part, everything works fine, but now, I got an error:
Error: A required parameter (slug) was not provided as a string in generateStaticParams for /[lng]/blog/[slug]
But in my page.tsx under [slug], there's no generateStaticParams:
type PageProps = {
params: {
slug: string
}
}
export default function Post({ params: { slug } }: PageProps) {
...
Is the folder structure correct?
I believe this is caused by the two dynamic routes [lang]/blog/[slug], but don't know how to fix it. I tried to do it the old way (before Next.js 13):
app
--[lang]
----blog
------page.tsx
------[slug].tsx
But no luck, any idea?
(or should I get the params with useRouter and pass them the component with generateStaticParams?)
英文:
I'm working on a Next.js 13 project that requires internationalization support and a blog . Here is the structure of the app folder:
app
--[lang]
----blog
------page.tsx
------[slug]
--------page.tsx
The [lang] part is for links of different languages:
http://localhost/en/about
http://localhost/fr/about
The blog part is for the post list:
http://localhost/en/blog
(shows a list of all blog)
The [slug] part is for the post detail:
http://localhost/en/blog/my-first-post
Before I add the [lang] part, everything works fine, but now, I got an error:
Error: A required parameter (slug) was not provided as a string in generateStaticParams for /[lng]/blog/[slug]
But in my page.tsx under [slug], there's no generateStaticParams:
type PageProps = {
params: {
slug: string
}
}
export default function Post({ params: { slug } }: PageProps) {
...
Is the folder structure correct?
I believe this is caused by the two dynamic routes [lang]/blog/[slug], but don't know how to fix it. I tried to do it the old way (before Next.js 13):
app
--[lang]
----blog
------page.tsx
------[slug].tsx
But no luck, any idea?
(or should I get the params with useRouter and pass them the component with generateStaticParams?)
答案1
得分: 2
我通过Next.js的官方文档找到了答案。如果有人需要答案,这是链接:
https://nextjs.org/docs/app/api-reference/functions/generate-static-params#examples
英文:
I figured it out with the help of the official document of next.js. In case anyone needs an answer, here is the link:
https://nextjs.org/docs/app/api-reference/functions/generate-static-params#examples
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论