Pārlūkot izejas kodu

fix: menu 菜单过长样式展示问题

lanceJiang 1 gadu atpakaļ
vecāks
revīzija
cfe3d24695
2 mainītis faili ar 4 papildinājumiem un 2 dzēšanām
  1. 1 1
      src/layout/components/Menu/SubMenu.vue
  2. 3 1
      src/styles/sidebar.scss

+ 1 - 1
src/layout/components/Menu/SubMenu.vue

@@ -1,6 +1,6 @@
 <template>
 	<template v-for="subItem in menuList" :key="subItem.path">
-		<el-sub-menu v-if="subItem.children?.length" popper-class="layout-menu-popper-wrap" :index="subItem.path">
+		<el-sub-menu v-if="subItem.children?.length" teleported popper-class="layout-menu-popper-wrap" :index="subItem.path">
 			<template #title>
 				<MenuIcon v-if="subItem.meta.icon" :icon-class="subItem.meta.icon" />
 				<!--				<el-icon v-if="subItem.meta.icon">

+ 3 - 1
src/styles/sidebar.scss

@@ -69,8 +69,10 @@ $active_color: var(--el-menu-active-color);
 
 	// 子菜单太长时出现滚动条
 	> .el-menu--popup {
-		max-height: 100vh;
+		max-height: 60vh;
 		overflow-y: auto;
+		&::-webkit-scrollbar{width:2px;height:2px}
+		&::-webkit-scrollbar-track{border-radius:2px;background: $le-bg-color_1;}
 		& > li:first-child {
 			margin-top: 0;
 		}