json - NextJS 根据页面获取自定义 JSON
问题描述
我知道您可以执行以下操作
export async function getStaticProps({ params }) {
console.log(params)
const res = await fetch(`https://example.com/api-access/news/2021_autumn_home_style_tips`)
const data = await res.json()
if (!data) {
return {
notFound: true,
}
}
return {
props: { data }, // will be passed to the page component as props
}
}
但是,如果取决于用户按下的新闻项目的最后一部分需要更改怎么办。
https://example.com/api-access/news/2021_autumn_home_style_tips
https://example.com/api-access/news/2020_autumn_home_style_tips
https://example.com/api-access/news/2021_car
https://example.com/api-access/news/top_songs
例如,如何制作一个允许我运行该 slug url 的 [slug].js 页面
https://myexample.com/news/top_songs
将从https://example.com/api-access/news/top_songs
我努力了
export const getStaticPaths: GetStaticPaths<{ slug: string }> = async () => {
console.log(params)
const res = await fetch('https://example.com/api-access/news/{slug}')
const data = await res.json()
if (!data) {
return {
notFound: true,
}
}
return {
props: { data }, // will be passed to the page component as props
}
}
解决方案
推荐阅读
- reactjs - AXIOS 调用通过网络访问 XML 文件
- javascript - 这种使用 Javascript 创建工具提示的方法存在问题
- c - 使用以下代码将 50 MHz 信号频率缩放至 1MHz。发生“endmodule”错误
- java - 无法使用 JMF 播放视频
- visual-studio-code - VS CODE 终端无法使用代理
- python - 如何使用 NumPy 创建一个 3 X 3 矩阵
- javascript - 删除 .txt 文档的前 25 行
- javascript - 当我在 vue 路由器中传递一个对象时,我得到了 [object Object]
- linux - 系统管理员将 vm 迁移到 azure
- android - 如果 Android Service 不是线程,为什么说它在后台运行?