feat(componentList):为菜单项添加图标和选中状态

src/pages/componentDevelopment/componentList/index.tsx

@@ -9,9 +9,24 @@ const GlobalVarContainer = () => {
   const [selectedItem, setSelectedItem] = useState('数字类型');
 
   const menuItems = [
-    '我的组件',
+    {
-    '协同组件',
+      key: '1',
-    '组件审核'
+      label: '我的组件',
+      icon: '/ideContainer/icon/myComp.png',
+      activeIcon: '/ideContainer/icon/myComp_active.png'
+    },
+    {
+      key: '2',
+      label: '协同组件',
+      icon: '/ideContainer/icon/teamComp.png',
+      activeIcon: '/ideContainer/icon/teamComp_active.png'
+    },
+    {
+      key: '3',
+      label: '组件审核',
+      icon: '/ideContainer/icon/compAudit.png',
+      activeIcon: '/ideContainer/icon/compAudit_active.png'
+    }
   ];
 
   return (
@@ -21,10 +36,12 @@ const GlobalVarContainer = () => {
         {menuItems.map((item, index) => (
           <div
             key={index}
-            className={selectedItem === item ? styles['selected'] : ''}
+            className={selectedItem === item.label ? styles['selected'] : ''}
-            onClick={() => setSelectedItem(item)}
+            onClick={() => setSelectedItem(item.label)}
           >
-            {item}
+            <img src={selectedItem === item.label ? item.activeIcon : item.icon} alt=""
+                 style={{ width: 20, height: 20, marginRight: 12 }} />
+            <span>{item.label}</span>
           </div>
         ))}
       </div>