feat(遮罩层组件): 设置打开时关闭页面滑动的功能,仅保留遮罩层自己的滑动功能,解决了在遮罩层空白区域滑动导致页面滑动的bug

This commit is contained in:
hzj 2025-12-19 12:14:59 +08:00
parent 5c75c98734
commit 4e0589a41b
2 changed files with 20 additions and 1 deletions

View File

@ -18,12 +18,31 @@
</template>
<script setup>
import { watch } from 'vue'
const props = defineProps({
maskLayerShow: {
type: Boolean,
required: true,
},
})
//
watch(
() => props.maskLayerShow,
(newVal) => {
if (newVal) {
//
document.body.style.overflow = 'hidden'
document.body.style.touchAction = 'none'
} else {
//
document.body.style.overflow = ''
document.body.style.touchAction = ''
}
},
{ immediate: true }
)
</script>
<style lang="scss" scoped>

View File

@ -541,7 +541,7 @@
<!-- 弹窗遮罩层 -->
<maskLayer :maskLayerShow="maskLayerShow" @click="maskLayerShow = false">
<!-- help弹窗 -->
<div style="margin: 20% 0" @click.stop>
<div style="margin: 10vh 0 5vh" @click.stop>
<itemCenter
:imgUrl="imageUrl(getImgName('helpBg'))"
:contentStyle="`inset: 15% 4% 3%;overflow-y: auto;display:block;`"