Javascript Next.js:嵌套动态路由的GetStaticPath
假设您拥有以下数据结构: 常数数据={ 职位:[{ id:1, 标题:职位1 slug:post-1 }, { id:2, 标题:职位2 slug:post-2 }], 评论:[{ id:1, posted:post-1, 正文:第1篇的评论1 }, { id:2, posted:post-1, 正文:第1篇评论2 }, { id:3, posted:post-2, 正文:第2篇评论1 }] } 您有以下路线/帖子/[postId[/[commentId] 因此,下一个.js结构文件夹是:posts/[postId]/[commented].js 然后需要为该路由生成静态路径 我的代码如下: 导出异步函数GetStaticPath{ const{posts,comments}=data const path=posts.mappost=>{ 回复评论 .filtercomment=>comment.postId==post.slug .mapcomment=>{ 返回{ 参数:{ posted:post.slug, commentId:comment.id } } } } } 但它不起作用。抛出的错误是:Javascript Next.js:嵌套动态路由的GetStaticPath,javascript,reactjs,next.js,static-site-generation,Javascript,Reactjs,Next.js,Static Site Generation,假设您拥有以下数据结构: 常数数据={ 职位:[{ id:1, 标题:职位1 slug:post-1 }, { id:2, 标题:职位2 slug:post-2 }], 评论:[{ id:1, posted:post-1, 正文:第1篇的评论1 }, { id:2, posted:post-1, 正文:第1篇评论2 }, { id:3, posted:post-2, 正文:第2篇评论1 }] } 您有以下路线/帖子/[postId[/[commentId] 因此,下一个.js结构文件夹是:pos
Error: Additional keys were returned from `getStaticPaths` in page "/clases/[courseId]/[lessonId]". URL Parameters intended for this dynamic route must be nested under the `params` key, i.e.:
return { params: { postId: ..., commentId: ... } }
Keys that need to be moved: 0, 1.
如何将数据映射或循环到正确的返回格式?
提前感谢!问题似乎是您从getStaticPaths返回的数据形状错误:
[
[ { params: {} }, { params: {} } ],
[ { params: {} } ]
]
正确的形状是:
[
{ params: {} },
{ params: {} },
{ params: {} }
]
刚试过这个,效果很好
export async function getStaticPaths() {
const paths = data.comments.map((comment) => {
return {
params: {
postId: comment.postId,
commentId: comment.id
}
}
});
console.log(paths);
return {
paths,
fallback: false
}
};
它生成3个URL:
/员额/员额-1/1
/员额/员额-1/2
/员额/员额-2/3
这就是您需要的吗?问题似乎是您从getStaticPaths返回的数据形状错误:
[
[ { params: {} }, { params: {} } ],
[ { params: {} } ]
]
正确的形状是:
[
{ params: {} },
{ params: {} },
{ params: {} }
]
刚试过这个,效果很好
export async function getStaticPaths() {
const paths = data.comments.map((comment) => {
return {
params: {
postId: comment.postId,
commentId: comment.id
}
}
});
console.log(paths);
return {
paths,
fallback: false
}
};
它生成3个URL:
/员额/员额-1/1
/员额/员额-1/2
/员额/员额-2/3
这就是你所需要的吗?就像提到@Aaron一样,问题在于过滤器y el映射的双数组
return {
paths: [
{ params: { id: '1' } },
{ params: { id: '2' } }
],
fallback: ...
}
Doc就像提到@Aaron一样,问题在于过滤器y el映射的双数组
return {
paths: [
{ params: { id: '1' } },
{ params: { id: '2' } }
],
fallback: ...
}
Doc Thx@Aaron!你让我看到了,通过无意义地双重映射数组。我已经在评论中看到了帖子的id!Thx@Aaron!你让我看到了,通过无意义地双重映射数组。我已经在评论中看到了帖子的id!