英文:
Next.JS + Sanity. Hydration Error when including Time Stamp
问题
Here's the translated code portion:
有人对此有答案吗？每当我包括从Sanity获取的时间戳时，我都会收到一个水合错误。页面上的表达方式如下：
<p className="font-extralight text-sm">
由 <span className="text-blue-500">{post.author.name}</span>{" "}
发布于 {new Date(post._createdAt).toLocaleString()}
</p>
页面似乎可以正常呈现，但水合错误令人讨厌。删除此行会消除水合错误。如果有帮助的话，我也在此应用程序上使用了SSR和ISR。
英文:
Anyone have an answer to this? I am receiving a hydration error whenever I include a timestamp fetched from Sanity. Here's the way it is expressed on the page.
<p className="font-extralight text-sm">
Post by <span className="text-blue-500">{post.author.name}</span>{" "}
Published at {new Date(post._createdAt).toLocaleString()}
</p>
The page seems to render fine but the hydration error is annoying. Removing this line gets rid of the hydration error. I am using SSR and ISR on the this app as well if that is helpful.
答案1
得分: 1
只需将 suppressHydrationWarning 属性添加到呈现可能导致不匹配的元素中，例如在您的情况下是日期。
它仅适用于一级深度。不要过度使用它，它旨在用作紧急逃生通道。
英文:
Just add suppressHydrationWarning property to the element which renders something that might produce mismatch, like a date in your case.
It only works one level deep. Don’t overuse it, it is intended to be used as an escape hatch.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论