在管理后台布局中引入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,
type AuthUser
} from '@/lib/auth'
import Link from 'next/link'
const navItems = [
{ 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 items-center">
<h1 className="text-xl font-semibold mr-8">
API管理后台
<Link href="/">
API管理后台
</Link>
</h1>
{/* Navigation */}
<nav className="flex space-x-8">
{navItems.map((item) => (
<button
<Link
key={item.key}
onClick={() => router.push(item.href)}
href={item.href}
className={`px-3 py-2 text-sm font-medium rounded-md transition-colors ${
pathname === item.href
? 'bg-primary text-primary-foreground'
@ -96,7 +99,7 @@ export default function AdminLayout({
}`}
>
{item.label}
</button>
</Link>
))}
</nav>
</div>