28 lines
791 B
React
28 lines
791 B
React
'use client';
|
|
|
|
import Link from 'next/link';
|
|
import { usePathname } from 'next/navigation';
|
|
|
|
const ITEMS = [
|
|
{ href: '/', label: '测试', icon: 'home' },
|
|
{ href: '/discover', label: '发现', icon: 'discover' },
|
|
{ href: '/me', label: '我的', icon: 'me' }
|
|
];
|
|
|
|
export default function BottomNav() {
|
|
const pathname = usePathname();
|
|
return (
|
|
<nav className="bottomNav" aria-label="主导航">
|
|
{ITEMS.map(item => {
|
|
const active = item.href === '/' ? pathname === '/' : pathname.startsWith(item.href);
|
|
return (
|
|
<Link key={item.href} href={item.href} className={`navItem ${active ? 'active' : ''}`}>
|
|
<i className={`navGlyph ${item.icon}`} />
|
|
<span>{item.label}</span>
|
|
</Link>
|
|
);
|
|
})}
|
|
</nav>
|
|
);
|
|
}
|