unstable_cache
注意: 此 API 在达到稳定状态后将被
use cache
替换。
unstable_cache
允许你缓存昂贵操作的结果,例如数据库查询,并在多个请求中重用它们。
import { getUser } from './data';
import { unstable_cache } from 'next/cache';
const getCachedUser = unstable_cache(
async (id) => getUser(id),
['my-app-user']
);
export default async function Component({ userID }) {
const user = await getCachedUser(userID);
...
}
须知:
- 不支持在缓存作用域内访问动态数据源,例如
headers
或cookies
。 如果你需要在缓存函数内部使用这些数据,请在缓存函数外部使用headers
,并将所需的动态数据作为参数传入。- 此 API 使用 Next.js 内置的 数据缓存 在请求和部署之间持久化结果。
警告:此 API 不稳定,未来可能会更改。 如果需要,我们将在 API 稳定时提供迁移文档和 codemods。
参数
const data = unstable_cache(fetchData, keyParts, options)()
fetchData
:这是一个异步函数,用于获取你想缓存的数据。 它必须是一个返回Promise
的函数。keyParts
:这是一个额外的键数组,用于进一步标识缓存。 默认情况下,unstable_cache
已经使用参数和你函数的字符串化版本作为缓存键。 在大多数情况下,它是可选的;唯一需要使用它的情况是当你使用外部变量但没有将它们作为参数传递时。 但是,如果你不将函数内部使用的闭包作为参数传递,则添加它们非常重要。options
:这是一个对象,用于控制缓存的行为。 它可以包含以下属性tags
:一个标签数组,可用于控制缓存失效。 Next.js 不会使用它来唯一标识函数。revalidate
:缓存应重新验证的秒数。 省略或传递false
以无限期缓存,或直到调用匹配的revalidateTag()
或revalidatePath()
方法。
返回值
unstable_cache
返回一个函数,当调用该函数时,它会返回一个 Promise,该 Promise 解析为缓存的数据。 如果数据不在缓存中,则将调用提供的函数,并且其结果将被缓存并返回。
示例
app/page.tsx
import { unstable_cache } from 'next/cache'
export default async function Page({
params,
}: {
params: Promise<{ userId: string }>
}) {
const { userId } = await params
const getCachedUser = unstable_cache(
async () => {
return { id: userId }
},
[userId], // add the user ID to the cache key
{
tags: ['users'],
revalidate: 60,
}
)
//...
}
版本历史
版本 | 变更 |
---|---|
v14.0.0 | 引入了 unstable_cache 。 |
这是否有帮助?