菜单样式

src/layout/components/Menu/src/Menu.vue

@@ -100,14 +100,13 @@ export default defineComponent({
 
     const renderMenu = () => {
       return (
-        <ElMenu
+        <ElMenu style="height:100%"
           defaultActive={unref(activeMenu)}
           mode={unref(menuMode)}
           collapse={
             unref(layout) === 'top' || unref(layout) === 'cutMenu' ? false : unref(collapse)
           }
           uniqueOpened={unref(layout) === 'top' ? false : unref(uniqueOpened)}
-          backgroundColor="var(--left-menu-bg-color)"
           textColor="var(--left-menu-text-color)"
           activeTextColor="var(--left-menu-text-active-color)"
           onSelect={menuSelect}
@@ -307,4 +306,8 @@ $prefix-cls: #{$namespace}-menu-popper;
     }
   }
 }
+.v-menu .el-menu .el-menu .el-menu-item:not(.is-active):hover{
+  background-color: rgb(241,243,244) !important;
+}
+
 </style>

src/store/modules/app.ts

@@ -79,7 +79,7 @@ export const useAppStore = defineStore('app', {
         // 左侧菜单背景颜色
         leftMenuBgColor: 'rgb(241,243,244)',
         // 左侧菜单浅色背景颜色
-        leftMenuBgLightColor: 'rgb(241,243,244)',
+        leftMenuBgLightColor: '#fff',
         // 左侧菜单选中背景颜色
         leftMenuBgActiveColor: 'rgb(241,243,244)',
         // 左侧菜单收起选中背景颜色