Nextjs - Reactjs - 链接模式 - 不变违规:React.Children.只期望接收单个 React

Question

我正在使用NextJS。我正在研究布局。在我的布局中，有一些带有链接的导航组件。当我尝试创建带有锚点的链接时，我的控制台返回我：

Nextjs - Reactjs - 不变冲突：React.Children.only 预期 接收单个 React 元素子元素

Howerver 这只是 NextJS 的经典模式，这是我的链接的示例：

<Link href={{pathname:'/blog'}} className={style.links_items}
to="/blog"> <a title="Blog">BLOG -</a></Link>

只有当我这样做时，它才是工作：

 <Link href={{pathname:'/blog'}} className={style.links_items}
    to="/blog"> BLOG -</Link>

但后来，我收到了警告：

您直接在 <Link> 中使用字符串。此用法已 荒废的。请添加一个<a>标签作为<Link>的子项

如果有人有任何提示，那就太好了，

谢谢

Answer 1

在链接中的 a 元素之前有一个空格。这意味着链接有两个子节点：文本节点(其中包含空格(和a元素。删除空格：

<Link href={{pathname:'/blog'}} className={style.links_items}
to="/blog"><a title="Blog">BLOG -</a></Link>