【问题标题】:Next JS | getStaticPath下一个 JS |获取静态路径
【发布时间】:2021-08-30 00:54:07
【问题描述】:
  1. 如果我不打算运行“下一个导出”命令,是否需要使用 getStaticPaths?
  2. 能否使用 getStaticProps 在服务器端创建缓存结构并重新验证详细信息页面 (/user/1)?还是除了使用 SWR 或 getServerSideRender 之外别无选择?
  3. 在detail(/user/1)页面再次获取所有数据不是多余吗?

注意:用户详情页面可以每 60 秒刷新一次。即时更新并不重要。

export async function getStaticPaths() {
  const res = await fetch('https://.../posts')
  const posts = await res.json()
  const paths = posts.map((post) => ({
    params: { id: post.id },
  }))
  return { paths }
}

export async function getStaticProps({ params }) {
  const res = await fetch(`https://.../posts/${params.id}`)
  const post = await res.json()
  return { props: { post } }
}

【问题讨论】:

    标签: next.js server-side-rendering server-side


    【解决方案1】:
    1. 没有。当涉及到以增量方式静态生成大量页面时,getStaticPaths 很有用。

    2. 是的,在下一个 js 中,您只能在使用 getStaticProps 生成静态页面时使用重新验证缓存策略,如下所示:

    export async function getStaticProps({ params }) {
      const res = await fetch(`https://.../posts/${params.id}`);
      const post = await res.json();
      // revalidate value is basically in seconds so here it will revalidate the 
      // data every 1 second only If there is an update to it .
      return { props: { post }  , revalidate : 1 }
    }
    
    1. 您可以使用 getStaticProps 方法和 getStaticPaths 以增量方式生成您需要的所有页面并使用分页。

    【讨论】:

      猜你喜欢
      • 2020-07-03
      • 2022-07-29
      • 2020-12-27
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2022-12-16
      • 1970-01-01
      • 2014-12-27
      相关资源
      最近更新 更多