feat: add selectedKeys/openKeys helpers for nested menu
This commit is contained in:
@@ -155,20 +155,37 @@ const MainLayout: React.FC = () => {
|
||||
if (isMobile) setDrawerOpen(false);
|
||||
};
|
||||
|
||||
const transformToMenuItems = (items: MenuItemType[]): any[] => {
|
||||
return items.map((item) => ({
|
||||
key: item.key,
|
||||
icon: item.icon,
|
||||
label: item.label,
|
||||
children: item.children ? transformToMenuItems(item.children) : undefined,
|
||||
}));
|
||||
const findSelectedKeys = (items: MenuItemType[], pathname: string): string[] => {
|
||||
for (const item of items) {
|
||||
if (item.key === pathname) return [item.key];
|
||||
if (item.children) {
|
||||
const found = findSelectedKeys(item.children, pathname);
|
||||
if (found.length > 0) return found;
|
||||
}
|
||||
}
|
||||
return [pathname];
|
||||
};
|
||||
|
||||
const findOpenKeys = (items: MenuItemType[], pathname: string): string[] => {
|
||||
for (const item of items) {
|
||||
if (item.children) {
|
||||
if (item.children.some((c) => c.key === pathname || (c.children && c.children.some((gc) => gc.key === pathname)))) {
|
||||
return [item.key];
|
||||
}
|
||||
}
|
||||
}
|
||||
return [];
|
||||
};
|
||||
|
||||
const selectedKeys = findSelectedKeys(menuItems, location.pathname);
|
||||
const openKeys = findOpenKeys(menuItems, location.pathname);
|
||||
|
||||
const menuContent = (
|
||||
<Menu
|
||||
theme="light"
|
||||
mode="inline"
|
||||
selectedKeys={[location.pathname]}
|
||||
selectedKeys={selectedKeys}
|
||||
defaultOpenKeys={openKeys}
|
||||
items={transformToMenuItems(menuItems)}
|
||||
onClick={({ key }) => handleMenuClick(key)}
|
||||
style={{ border: 'none' }}
|
||||
|
||||
Reference in New Issue
Block a user