reactjs - Next.js 获取静态路径
问题描述
我对“getStaticPaths”函数有疑问。当我尝试使用参数获取动态显示时,它向我显示错误:在 getStaticPaths for / movies / [id] 中未提供所需参数(id)作为字符串,但如果我使用上面的其他方式,它可以工作。最重要的是,我是文档。
import fetch from 'node-fetch';
function MovieSelect({movie}){
return(
<div>
<h1>Test: {movie.name}</h1>
<p>{movie.summary.replace(/<[/]?[pb]>/g, '')}</p>
{movie.image ? <img src={movie.image.medium} /> : null}
</div>
)
}
export async function getStaticPaths(){
const request = await fetch('https://api.tvmaze.com/search/shows?q=batman')
const movies = await request.json()
//const paths = movies.map(movie =>`/movies/${movie.show.id}`)
const paths = movies.map(movie =>({
params: {id: movie.show.id},
}))
return {
paths,
fallback: false
}
}
export async function getStaticProps({params}){
const request = await fetch(`https://api.tvmaze.com/shows/${params.id}`)
const movie = await request.json()
return{
props:{
movie
}
}
}
export default MovieSelect
解决方案
在 getStaticPaths for / movies / [id]中未提供必需参数 (id) 作为字符串
id 应该是错误建议的字符串。从浏览器点击 api 后,您可以看到 id 不是字符串而是数字。您需要将其转换为字符串。
params: {id: movie.show.id.toString()},
推荐阅读
- python - 如何在 CSV 文件中绘制或显示特定列?
- php - 请提供有效的缓存路径 Laravel5.7
- php - Laravel JSON 输出格式
- azure - 部署的 REST API 总是给出 500 错误
- git - Bamboo + Git Azure DevOps =“致命:无法从远程存储库读取。”。对于 Git 子模块
- java - 从包含 3 通道像素信息的 3d 字节数组创建 java 位图图像
- mongodb - 如何为所有文档生成唯一字段
- javascript - 在复选框中输入文本到 JSON 数据
- c# - 如何从不同于 ViewModel 的类更新我的集合
- c++ - 如何访问二维数组