next.js 下一个路由显示404错误时使用来自下一个/链接[重复]

hwamh0ep  于 2023-06-22  发布在  其他
关注(0)|答案(1)|浏览(149)

此问题已在此处有答案

Issue with navigating to a new page in Next.js(1个答案)
11天前关闭
我正在创建登录路由。在一个导航栏组件中,我在一个按钮标签中添加了一个链接到登录路由,但是当我点击路由时,它会把我带到显示404错误的页面。
--app
----页
------组件
--------Navbar.js
------login.js
----global.css
----layout.js
----pages.js

导航栏组件

import Link from "next/link";

export default function Navbar() {
    return (
        <div>
            <div className="flex flex-row bg-nav-bar-clr justify-between px-10 py-7">
                <h1 className="text-5xl font-extrabold italic text-klove">Klove</h1>
                <div className="flex gap-10">
                    <button className=" text-xl bg-signup-btn-clr px-8 py-2 rounded-3xl">Signup</button>
                    <Link href={'login'} className="text-xl bg-login-btn-clr px-8 py-2 rounded-3xl">Login</Link>
                </div>
            </div>
            <div className="flex justify-evenly my-4">
                <h1 className="text-2xl">HOME</h1>
                <h1 className="text-2xl">ABOUT</h1>
                <h1 className="text-2xl">CONTACT</h1>
            </div>

        </div>
    )
}
guykilcj

guykilcj1#

由于您没有使用src文件夹,并且您在应用的顶层有app目录,因此nextjs可能认为您确实使用app目录进行路由,而不是pages。因此,app文件夹中的pages目录不被视为路由器。
要解决这个问题,请将pages目录移到顶层并删除app

相关问题