是否有必要将“passHref”传递给具有 Semantic UI React 作为其子组件的 NextJS <Link> ？

Question

我一直在阅读 nextjs 文档，它在这里说：

\n

\n

如果 的子组件Link是函数组件，除了使用\n 之外passHref，还必须将该组件包装在 中React.forwardRef：

\n

\n

我是使用 Semantic UI React 的新手，所以我不确定是否需要这样做，更重要的是如何做到这一点。我对此感到担忧，因为就在上面引用的行之前，文档在这里说：

\n

\n

如果没有这个（passHref），标签将没有 href 属性，这可能会损害您的网站\xe2\x80\x99s SEO。

\n

\n

passHref我可以这样传递：

\n

<Link href=\'/posts\' passHref>\n  <Button>See Posts</Button>\n</Link>\n

\n

但问题是我不认为我们可以用 Semantic UI 包装组件，因为React.forwardRef它是刚刚导入的。所以我的问题是：

\n

\n
• 就这样就可以了吗？
\n
• 或者是否有解决方法可以“不损害”我网站的搜索引擎优化？
\n

\n

Answer 1

是的 。nextJs 文档指出，如果您的子组件不仅仅是一个标签，而且是一个函数或类组件，那么需要 passHref。每当你使用 React 组件作为子组件时，请确保传递它