fix(layout): 修复Chrome 144+滚动锁定问题,调整overflow属性

This commit is contained in:
PKC278
2026-01-16 22:45:43 +08:00
parent 1d04c9b9c9
commit 64b5fa7038
3 changed files with 8 additions and 3 deletions

View File

@@ -94,7 +94,6 @@
<style> <style>
#app { #app {
block-size: 100%; block-size: 100%;
overflow: auto;
-webkit-overflow-scrolling: touch; -webkit-overflow-scrolling: touch;
overscroll-behavior: contain; overscroll-behavior: contain;
} }

View File

@@ -224,7 +224,9 @@ export default defineComponent({
.layout-page-content { .layout-page-content {
// display: flex; // display: flex;
overflow: hidden; // 使用 clip 替代 hidden避免 Chrome 144+ 滚动锁定问题
overflow-x: clip;
overflow-y: auto;
.page-content-container { .page-content-container {
inline-size: 100%; inline-size: 100%;

View File

@@ -13,6 +13,8 @@ html {
body { body {
background: rgb(var(--v-theme-background)); background: rgb(var(--v-theme-background));
overscroll-behavior-y: contain; overscroll-behavior-y: contain;
// Chrome 144+ 兼容性:覆盖 Vuetify 的内联 overflow: hidden 样式
overflow: visible !important;
--webkit-overflow-scrolling: touch; --webkit-overflow-scrolling: touch;
} }
@@ -35,7 +37,9 @@ body,
.layout-page-content { .layout-page-content {
@include mixins.boxed-content(true); @include mixins.boxed-content(true);
overflow: hidden; // Chrome 144+ 兼容性:使用 clip 替代 hidden避免滚动锁定问题
// overflow: hidden 在新版 Chrome 中可能意外阻止垂直滚动
overflow: clip;
flex-grow: 1; flex-grow: 1;
// TODO: Use grid gutter variable here; // TODO: Use grid gutter variable here;