接下来js缓存重新验证

Question

Next.js 的新功能。使用最新版本14.0.X.

我有一条根据查询 ID 从数据库获取数据的路线

• 产品/详情？id=1
• 产品/详情？id=2
• 产品/详情？id=3

id=1 的数据可以由用户更改（例如产品描述或价格）。

当用户更改它时，我重新验证此路径“产品/详细信息”。

我怀疑在这种情况下 id=2 和 id=3 的缓存数据即使没有更改也将重新验证？

如果是这种情况，仅重新验证我需要的内容的正确方法是什么？

1. 我应该像这样重新验证确切的路径吗 revalidatePath('产品/详细信息？id=3')

2. 或者将 id 作为查询传递是有意义的，创建一个动态文件夹 /产品/详细信息/id?q1=v1

当用户更改数据时，只需重新验证“/product/details/id”？

这里的最佳实践/正确方法是什么？

Answer 1

第 1 步：要使用动态分段创建动态路由，您可以尝试遵循文档中的约定：https://nextjs.org/docs/app/building-your-application/routing/dynamic-routes

• 如果您使用应用程序路由器：

  File name: app/product/details/[id]/page.js
  Example URL: /product/details/1
  

• 或者，如果您使用页面路由器：

  File name: pages/product/details/[id].js
  Example URL: /product/details/1
  

第 2 步：您可以选择自己选择的重新验证机制。示例：https://nextjs.org/docs/app/api-reference/functions/revalidatePath

• 重新验证特定 URL

  import { revalidatePath } from 'next/cache'
  revalidatePath('/blog/post-1')
  

  这将在下一页访问时重新验证一个特定的 URL。

• 或者，重新验证页面路径

  import { revalidatePath } from 'next/cache'
  revalidatePath('/blog/[slug]', 'page')
  

  这将在下一次页面访问时重新验证与所提供的页面文件匹配的所有 URL。这不会使特定页面下方的页面失效。例如，/blog/[slug] 不会使 /blog/[slug]/[author] 无效。