From 658b51a747bda6cb37ee6813705c227999393eb3 Mon Sep 17 00:00:00 2001
From: Hooray <304327508@qq.com>
Date: Thu, 22 Jan 2026 22:30:20 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8D=20overscroll-behavior?=
 =?UTF-8?q?=20=E5=B1=9E=E6=80=A7=E8=A1=8C=E4=B8=BA=E5=9C=A8=20chrome=20144?=
 =?UTF-8?q?=20=E5=8F=98=E6=9B=B4=E5=BC=95=E8=B5=B7=E7=9A=84=20bug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

https://developer.chrome.com/release-notes/144?hl=zh-cn#respect_overscroll-behavior_on_non-scrollable_scroll_containers
---
 src/layouts/components/Header/index.vue                   | 2 +-
 src/layouts/components/MainSidebar/index.vue              | 2 +-
 src/layouts/components/Menu/sub.vue                       | 2 +-
 src/layouts/components/SubSidebar/index.vue               | 2 +-
 src/ui/components/FaScrollArea/scroll-area/ScrollArea.vue | 2 +-
 5 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/layouts/components/Header/index.vue b/src/layouts/components/Header/index.vue
index 67b826d1..ba3e8e35 100755
--- a/src/layouts/components/Header/index.vue
+++ b/src/layouts/components/Header/index.vue
@@ -19,7 +19,7 @@ const { switchTo } = useMenu()
         <component :is="useSlots('header-start')" />
         <Logo class="title" />
         <component :is="useSlots('header-after-logo')" />
-        <FaScrollArea :scrollbar="false" mask horizontal gradient-color="var(--g-header-bg)" class="menu-container h-full flex-1">
+        <FaScrollArea :scrollbar="false" mask horizontal gradient-color="var(--g-header-bg)" class="menu-container h-full flex-1 overscroll-contain">
           <!-- 顶部模式 -->
           <div class="menu h-full flex of-hidden transition-all">
             <template v-for="(item, index) in menuStore.allMenus" :key="index">
diff --git a/src/layouts/components/MainSidebar/index.vue b/src/layouts/components/MainSidebar/index.vue
index a91e73d5..ed31376f 100755
--- a/src/layouts/components/MainSidebar/index.vue
+++ b/src/layouts/components/MainSidebar/index.vue
@@ -38,7 +38,7 @@ onUnmounted(() => {
       <component :is="useSlots('main-sidebar-top')" />
       <Logo :show-title="false" class="sidebar-logo" />
       <component :is="useSlots('main-sidebar-after-logo')" />
-      <FaScrollArea :scrollbar="false" mask gradient-color="var(--g-main-sidebar-bg)" class="menu flex-1">
+      <FaScrollArea :scrollbar="false" mask gradient-color="var(--g-main-sidebar-bg)" class="menu flex-1 overscroll-contain">
         <!-- 侧边栏模式（含主导航） -->
         <div class="w-full flex flex-col of-hidden py-1 transition-all -mt-2">
           <template v-for="(item, index) in menuStore.allMenus" :key="index">
diff --git a/src/layouts/components/Menu/sub.vue b/src/layouts/components/Menu/sub.vue
index f33aa874..14e6b8cf 100644
--- a/src/layouts/components/Menu/sub.vue
+++ b/src/layouts/components/Menu/sub.vue
@@ -214,7 +214,7 @@ function handleMouseleave() {
           'bg-[var(--g-sub-sidebar-bg)]': rootMenu.isMenuPopup,
           'border shadow-xl fixed z-3000 w-[200px]': rootMenu.isMenuPopup,
           'mx-1': rootMenu.isMenuPopup && (rootMenu.props.mode === 'vertical' || level !== 0),
-          'py-1': rootMenu.isMenuPopup,
+          'py-1 overscroll-contain': rootMenu.isMenuPopup,
         })"
       >
         <template v-for="item in menu.children" :key="item.path ?? rootMenu.getUseId(item)">
diff --git a/src/layouts/components/SubSidebar/index.vue b/src/layouts/components/SubSidebar/index.vue
index 7a824b19..3dd2fb99 100755
--- a/src/layouts/components/SubSidebar/index.vue
+++ b/src/layouts/components/SubSidebar/index.vue
@@ -54,7 +54,7 @@ watch(() => menuStore.actived, (val, oldVal) => {
         }"
       />
       <component :is="useSlots('sub-sidebar-after-logo')" />
-      <FaScrollArea :scrollbar="false" mask gradient-color="var(--g-sub-sidebar-bg)" class="flex-1">
+      <FaScrollArea :scrollbar="false" mask gradient-color="var(--g-sub-sidebar-bg)" class="flex-1 overscroll-contain">
         <TransitionGroup :name="transitionName">
           <template v-for="(mainItem, mainIndex) in menuStore.allMenus" :key="mainIndex">
             <div v-show="mainIndex === menuStore.actived">
diff --git a/src/ui/components/FaScrollArea/scroll-area/ScrollArea.vue b/src/ui/components/FaScrollArea/scroll-area/ScrollArea.vue
index 8c4eef55..9af884e3 100644
--- a/src/ui/components/FaScrollArea/scroll-area/ScrollArea.vue
+++ b/src/ui/components/FaScrollArea/scroll-area/ScrollArea.vue
@@ -28,7 +28,7 @@ defineExpose({
 
 <template>
   <ScrollAreaRoot v-bind="delegatedProps" :class="cn('relative overflow-hidden', props.class)">
-    <ScrollAreaViewport ref="viewportRef" class="scroll-area-viewport h-full w-full overscroll-contain rounded-[inherit]" @scroll="onScroll" @wheel="onWheel">
+    <ScrollAreaViewport ref="viewportRef" class="scroll-area-viewport h-full w-full rounded-[inherit]" @scroll="onScroll" @wheel="onWheel">
       <slot />
     </ScrollAreaViewport>
     <ScrollBar :class="{ 'opacity-0 pointer-events-none': !props.scrollbar }" />