文章/答案/技术大牛

发布

社区首页 >问答首页 >Next.js中的动态页面不会链接回普通页面

问Next.js中的动态页面不会链接回普通页面
EN

Stack Overflow用户

提问于 2021-03-23 01:23:50

回答 2查看 26关注 0票数 0

我有一个用next.js创建的网站，它有一个部分，这是动态路由存储在一个文件夹pages/artists/[slug].js这是伟大的，我必须整个动态路由工作得很好。

当我单击导航栏返回到标准页面，即主页、关于或联系人时，问题就出现了。

应链接到/contact或/about的位置最终链接到/artists/contact或/artists/about

我应该如何解决这个问题？我似乎在网上找不到关于这个问题的任何东西。

谢谢

编辑: nav组件的代码

import {useState} from 'react'
import Link from 'next/link'
import config from '../../config'
export default function Menu() {
  const [menu, setMenu] = useState(false);
  const menuToggle = () => {
    setMenu(!menu),
      [menu, setMenu]

  }
  return (
    <>
      <a id="menubtn" onClick={menuToggle}>
        <svg width="40" height="40">
          <rect width="40" height="3" x="0" y="12"/>
          <rect width="40" height="3" x="0" y="24"/>
        </svg>
      </a>
      <nav id="menu">
        <a id="close" onClick={menuToggle}>&times;</a>
        <ul>
          {config.navigation.map((link) => (
            <li key={link}>
              <Link href={link}>
                <a onClick={menuToggle}>{link.charAt(0).toUpperCase() + link.slice(1)}</a>
              </Link>
            </li>
          ))}
        </ul>
      </nav>
)}

javascript

reactjs

next.js

回答 2

Stack Overflow用户

发布于 2021-03-23 01:29:29

一些代码会对识别问题有很大帮助。我现在能说的就是仔细检查一下你的链接标签。确保您导入的是next/link包。

Docs reference next/link - Next.js

票数 1

Stack Overflow用户

发布于 2021-03-23 02:02:06

在发送之后，我仔细查看了代码，并注意到<Link> href如下所示

<Link href={link}>
  <a onClick={menuToggle}>  {link.charAt(0).toUpperCase() + link.slice(1)}</a>
</Link>

问题是路由器将浏览器连接到about，而不是/about，这显然会导致动态页面出现问题。

我将代码更新为这个，修复了它

<Link href={`/${link}`}>
  <a onClick={menuToggle}>{link.charAt(0).toUpperCase() + link.slice(1)}</a>
</Link>

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/66750893

复制

相似问题

问Next.js中的动态页面不会链接回普通页面
EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Next.js中的动态页面不会链接回普通页面EN

回答 2

Stack Overflow用户

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问Next.js中的动态页面不会链接回普通页面
EN