fix:菜单优化。。。。

src/modules/root/Menu.tsx

@@ -18,6 +18,7 @@ function Aside(props: any) {
   const [selectKey, setSelectKey] = useState();
   const [openKeys, setOpenKeys] = useState(['']);
   const [topLogoUrl, setTopLogoUrl] = useState("")
+  const [collapsed, setCollapsed] = useState(false)
   const rootSubmenuKeys = _.pluck(menuList, 'groupCode');
   useEffect(() => {
     const link = props.location.pathname;
@@ -37,7 +38,7 @@ function Aside(props: any) {
   }, [props.location.pathname])
   useEffect(()=> {
     getTopLeftLogo()
-  })
+  },[])
   function getTopLeftLogo() {
     if (User.getToken()) {
       StoreService.getStoreDetail({storeId:User.getStoreId()})
@@ -53,9 +54,9 @@ function Aside(props: any) {
   }
   function toggleMenu(item: any) {
     window.RCHistory.push(item.link)
-    if (!menuType) {
-      setOpenKeys([])
-    }
+    // if (!menuType) {
+    //   setOpenKeys([])
+    // }
   }
   function onOpenChange(key: any) {
     if (openKeys.includes(key)) {
@@ -76,6 +77,7 @@ function Aside(props: any) {
   }
   function handleMenu() {
     handleMenuType();
+    setCollapsed(!collapsed)
   }
 
   return (
@@ -113,9 +115,7 @@ function Aside(props: any) {
 
         <Menu
           style={{ minHeight: "100%", background: '#0E1935' }}
-          selectedKeys={selectKey}
-          openKeys={openKeys}
-          inlineCollapsed={false}
+          inlineCollapsed={collapsed}
           mode={menuType ? "inline" : "vertical"}
         >
           {
@@ -124,13 +124,11 @@ function Aside(props: any) {
                 return null;
               }
               if (item.children) {
-                return <SubMenu onTitleMouseEnter={() => onOpenChangeForHover(item.groupCode)} key={item.groupCode} style={{ marginTop: 0 }} className="first-menu-item" title={<div > 
-                    {/* <span style={{ marginRight: 16 }} className="iconfont icon" dangerouslySetInnerHTML={{ __html:item.icon}}></span> */}
-                    <img src={item.img} className="icon-img"></img>
-                    {menuType &&
-                      <span>{item.groupName}</span>
-                    }</div>
-                  } onTitleClick={() => onOpenChange(item.groupCode)}>
+                return <SubMenu 
+                        key={item.groupCode} 
+                        style={{ marginTop: 0 }} 
+                        title={<div><img src={item.img} className="icon-img"></img><span>{item.groupName}</span></div> } 
+                        onTitleClick={() => onOpenChange(item.groupCode)}>
                   {
                     item.children.map((_item: any, _index: any) => {
                       if (ctx.xmState.storeUserPermissionList.indexOf(_item.groupCode) === -1) {
@@ -144,16 +142,12 @@ function Aside(props: any) {
                   }
                 </SubMenu>
               } else {
-                return <Menu.Item onClick={() => { toggleMenu(item) }} key={item.groupCode} className="first-menu-item">
-                  {/* <span style={{ marginRight: 16 }} className="iconfont icon" dangerouslySetInnerHTML={{ __html:item.icon}}></span> */}
-                  {selectKey === item.groupCode ?
-                    <img src={item.selectImg} className="icon-img"></img>
-                    :
-                    <img src={item.img} className="icon-img"></img>
-                  }
-                  {menuType &&
-                    <span>{item.groupName}</span>
-                  }
+                return <Menu.Item 
+                        onClick={() => { toggleMenu(item) }} 
+                        key={item.groupCode} 
+                        icon={selectKey === item.groupCode ? <img src={item.selectImg} className="icon-img"></img>:<img src={item.img} className="icon-img"></img>}
+                        >
+                    {item.groupName}
                 </Menu.Item>
               }
             })