Next JS如何传递状态给getStaticProps



我正在使用getStaticProps从IGDB数据库获取游戏。一切都很好,但现在我想实现搜索游戏使用文本输入和按钮。我正在使用onChange从文本输入中获取值,我需要将状态传递给搜索查询,但是我如何在函数之外做到这一点?下面是代码:

export async function getStaticProps() {
const response = await fetch(
`https://api.igdb.com/v4/games/?fields=cover.*,name;search=${HERE I NEED TO PASS INPUT VALUE};`,
{
headers: {
'Accept': 'application/json',
'Client-ID': 'my client_id',
'Authorization': 'Bearer my_authorization',
}
})
const data = await response.json()
return {
props: {
apiGames: data
}
}
}
const Library = ({ apiGames }) => {
const [inputValue, setInputValue] = useState('')
return (
<input type="text" onChange={(e) => setInputValue(e.target.value)} placeholder='Start searching game...' />
)
}

getStaticProps仅在构建时运行。您可以使用这种方法获取初始数据,但由于搜索参数是在客户端生成的,因此还需要在客户端获取数据。您可以使用fetchapi,或者像axios

这样的库。

最新更新