侧边栏菜单
配置仪表盘页面的导航菜单
定义仪表盘/管理页面的导航菜单,每个项目都是 NestedMenuItem。
export function getSidebarLinks(): NestedMenuItem[] {
const t = useTranslations('Dashboard');
return [
{
title: t('dashboard.title'),
icon: <LayoutDashboardIcon className="size-4 shrink-0" />,
href: Routes.Dashboard,
external: false,
},
{
title: t('admin.title'),
icon: <SettingsIcon className="size-4 shrink-0" />,
authorizeOnly: ['admin'],
items: [
{
title: t('admin.users.title'),
icon: <UsersRoundIcon className="size-4 shrink-0" />,
href: Routes.AdminUsers,
external: false,
},
// 更多管理项...
],
},
// 更多侧边栏部分...
];
}
侧边栏配置类似于导航栏,但专门为仪表盘区域设计。它支持:
- 带图标的顶级链接
- 带嵌套项的可展开部分
- 通过
authorizeOnly
属性实现基于角色的可见性
侧边栏非常适合在应用程序的认证部分内提供导航,根据用户角色提供不同的选项。
您可以根据需要删除或添加更多项目到侧边栏。
视频教程
下一步
现在您了解了侧边栏配置,请探索其他相关主题: