mirror of
https://github.com/fantastic-admin/basic.git
synced 2026-10-07 13:28:38 +08:00
fix: 修复 overscroll-behavior 属性行为在 chrome 144 变更引起的 bug
https://developer.chrome.com/release-notes/144?hl=zh-cn#respect_overscroll-behavior_on_non-scrollable_scroll_containers
This commit is contained in:
@@ -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">
|
||||
|
||||
@@ -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">
|
||||
|
||||
@@ -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)">
|
||||
|
||||
@@ -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">
|
||||
|
||||
@@ -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 }" />
|
||||
|
||||
Reference in New Issue
Block a user