在管理后台布局中引入Next.js的Link组件,优化导航链接的实现方式,提升用户体验。

This commit is contained in:
wood chen 2025-06-14 20:32:37 +08:00
parent 5960444dc9
commit 10b530ee3c

View File

@ -10,6 +10,7 @@ import {
isAuthenticated, isAuthenticated,
type AuthUser type AuthUser
} from '@/lib/auth' } from '@/lib/auth'
import Link from 'next/link'
const navItems = [ const navItems = [
{ key: 'endpoints', label: 'API端点', href: '/admin' }, { key: 'endpoints', label: 'API端点', href: '/admin' },
@ -80,15 +81,17 @@ export default function AdminLayout({
<div className="flex justify-between items-center h-16"> <div className="flex justify-between items-center h-16">
<div className="flex items-center"> <div className="flex items-center">
<h1 className="text-xl font-semibold mr-8"> <h1 className="text-xl font-semibold mr-8">
<Link href="/">
API管理后台 API管理后台
</Link>
</h1> </h1>
{/* Navigation */} {/* Navigation */}
<nav className="flex space-x-8"> <nav className="flex space-x-8">
{navItems.map((item) => ( {navItems.map((item) => (
<button <Link
key={item.key} key={item.key}
onClick={() => router.push(item.href)} href={item.href}
className={`px-3 py-2 text-sm font-medium rounded-md transition-colors ${ className={`px-3 py-2 text-sm font-medium rounded-md transition-colors ${
pathname === item.href pathname === item.href
? 'bg-primary text-primary-foreground' ? 'bg-primary text-primary-foreground'
@ -96,7 +99,7 @@ export default function AdminLayout({
}`} }`}
> >
{item.label} {item.label}
</button> </Link>
))} ))}
</nav> </nav>
</div> </div>