在Next.js 13(应用路由器)中,当不使用fetch而是直接调用数据库时,如何使用Data Caching?

jc3wubiy  于 2023-08-04  发布在  其他
关注(0)|答案(1)|浏览(97)

在Next.js 13的文档中,https://nextjs.org/docs/app/building-your-application/caching#data-cache,说你可以在服务器组件中使用data-cache来缓存数据。
我正在尝试做类似的事情,但不是抓取,我想做查询数据库。

export default async function Home() {

  const categorias = await getCategorias()

  return (
    <main className="flex">
      <ul>
        {categorias.map((categoria) => (
          <li key={categoria.ID}>
            <Link href={`/item/${categoria.ID}`}>{categoria.TITULO}</Link>
          </li>
        ))}
      </ul>
    </main>
  );
}

字符串
存在任何选项来缓存“getCategorias”的数据

1zmg4dgp

1zmg4dgp1#

当您进入生产环境时,您的数据将按原样缓存。要在不使用fetch()的情况下控制其行为,您可以按照文档中的说明使用Route Segment Config。举例来说:

export const revalidate = 10 //  👈🏽 revalidate every 10s

export default async function Home() {

  const categorias = await getCategorias()

  return (
    <main className="flex">
      <ul>
        {categorias.map((categoria) => (
          <li key={categoria.ID}>
            <Link href={`/item/${categoria.ID}`}>{categoria.TITULO}</Link>
          </li>
        ))}
      </ul>
    </main>
  );
}

字符串

相关问题