时间戳

首页 > 解决方案 > 从 next/head 导入的 next.js Head 在共享页面上无法正常工作

javascript - 从 next/head 导入的 next.js Head 在共享页面上无法正常工作

问题描述

我已从 create-react-app 迁移到 create-next-app 到我的网站，但 Head(app/head) 组件无法正常工作

假设我有一个博客，并且在页面中，我有以下结构：pages/blog/index.js、pages/blog/[slug].js。在 [slug].js 中，我使用 Head 组件，因此它采用了博客文章的标题： <Head><title>{post.title}</title></Head> 问题是，当在博客文章上使用 react-share 时，即使我这样做了，它也没有放置正确的标题页面上的检查元素，我可以看到正确的 Head 值，但 Facebook 调试 ( https://developers.facebook.com/tools/debug/ ) 工具无法识别正确的标题。

将使用任何帮助。多谢你们

标签： javascriptreactjsnext.jsserver-side-rendering

解决方案

答案是您应该通过 getInitialProps 带来数据，以便组件可以访问它，而不是通过 useEffect :)

推荐阅读