Javascript 使用nextjs的材质ui选项卡？

我在MaterialUI、nextjs和typescript中有一个项目。我正在尝试让我的导航栏与nextjs一起工作：

import*as React from'React'；
从“@material ui/core/AppBar”导入AppBar；
从“下一个/链接”导入链接；
从“@material ui/core”导入{Tab，Tabs}”；
导出默认函数NavBar（）{
返回(
);
}

在本例中，我相信您希望用

元素包装

元素

<Tabs>
    <Link href="/timer" passHref>
      <Tab label="Timer" />
    </Link>
    <Link href="/" passHref>
      <Tab label="Home" />
    </Link>
</Tabs>

---

这对搜索引擎优化可能更好：

<Link href="/timer" passHref>
  <Tab component="a" label="Timer" />
</Link>

---

原因是

Link

没有将

href

添加到子级（即使它是

a

组件）

passHref

强制执行此操作，但是不能像中提到的那样将

preventDefault

置于

onClick

，因为它不会更改URL。

如果生成失败，错误消息是什么？