diff --git a/web/src/view/layout/aside/index.vue b/web/src/view/layout/aside/index.vue
index 7b57cf14b..353574cf9 100644
--- a/web/src/view/layout/aside/index.vue
+++ b/web/src/view/layout/aside/index.vue
@@ -6,28 +6,30 @@
       width : layoutSideWidth + 'px',
     }"
   >
-    <transition
-      :duration="{ enter: 800, leave: 100 }"
-      mode="out-in"
-      name="el-fade-in-linear"
-    >
-      <el-menu
-        :collapse="isCollapse"
-        :collapse-transition="false"
-        :default-active="active"
-        class="border-r-0 w-full"
-        unique-opened
-        @select="selectMenuItem"
+    <el-scrollbar>
+      <transition
+        :duration="{ enter: 800, leave: 100 }"
+        mode="out-in"
+        name="el-fade-in-linear"
       >
-        <template v-for="item in routerStore.asyncRouters[0].children">
-          <aside-component
-            v-if="!item.hidden"
-            :key="item.name"
-            :router-info="item"
-          />
-        </template>
-      </el-menu>
-    </transition>
+        <el-menu
+          :collapse="isCollapse"
+          :collapse-transition="false"
+          :default-active="active"
+          class="border-r-0 w-full"
+          unique-opened
+          @select="selectMenuItem"
+        >
+          <template v-for="item in routerStore.asyncRouters[0].children">
+            <aside-component
+              v-if="!item.hidden"
+              :key="item.name"
+              :router-info="item"
+            />
+          </template>
+        </el-menu>
+      </transition>
+    </el-scrollbar>
     <div
       class="absolute bottom-8 right-2 w-8 h-8 bg-gray-50 dark:bg-slate-800 flex items-center justify-center rounded cursor-pointer "
       :class="isCollapse ? 'right-0 left-0 mx-auto' : 'right-2'"