feat(ideContainer): 为菜单项添加唯一键值并优化菜单选择逻辑

- 在 menuData 和 menuData2 中为每个菜单项添加了唯一的 key 属性
- 修改了侧边栏菜单的渲染逻辑,使用菜单项的 key作为唯一标识
- 优化了菜单选择时传递的 currentKey值,现在传递实际的菜单项 key
master
钟良源 5 months ago
parent dca57d8d6f
commit c072be8d27

@ -1,6 +1,7 @@
export const menuData = [
{
title: '应用编排',
key: 'appFlow',
children: null,
path: 'appFlow'
},
@ -27,18 +28,21 @@ export const menuData = [
{
title: '事件',
children: null,
path: 'event'
path: 'event',
key: 'event'
},
{
title: '全局变量',
children: null,
path: 'globalVar'
path: 'globalVar',
key: 'globalVar'
}
];
export const menuData2 = [
{
title: '组件列表',
key: 'componentList',
children: [
{
title: '我的组件',
@ -60,16 +64,19 @@ export const menuData2 = [
{
title: '组件编码',
children: null,
path: 'componentCoding'
path: 'componentCoding',
key: 'componentCoding'
},
{
title: '组件部署',
children: null,
path: 'componentDeployment'
path: 'componentDeployment',
key: 'componentDeployment'
},
{
title: '组件测试',
children: null,
path: 'componentTest'
path: 'componentTest',
key: 'componentTest'
}
];

@ -158,7 +158,7 @@ function IDEContainer() {
if (menuItem) {
setSelected({
currentPath: menuItem.path,
currentKey: '' // 这里可以优化为实际的key值
currentKey: menuItem.key
});
}
}

@ -5,6 +5,7 @@ import { menuData, menuData2 } from './config/menuData';
interface MenuItemType {
title: string;
key?: string;
children?: MenuItemType[];
path?: string;
icon?: React.ReactNode;
@ -42,9 +43,9 @@ const SideBar: React.FC<SideBarProps> = ({ onMenuSelect, selectedKey, identity }
{menu.map((item, index) => (
<div
key={index}
className={`${styles['menu-item']} ${selectedKey === `${index}` ? styles['menu-item-active'] : ''}`}
className={`${styles['menu-item']} ${selectedKey === `${item.key}` ? styles['menu-item-active'] : ''}`}
onClick={() => {
onMenuSelect?.({ currentPath: item.path, currentKey: `${index}` });
onMenuSelect?.({ currentPath: item.path, currentKey: `${item.key}` });
}}
>
<div className={styles['menu-item-content']}>

Loading…
Cancel
Save