微信小程序滚动穿透问题

欢迎到专业群（ HBuilderX技术交流群 ） 咨询，群中有相关专业的管理员和群友。

出现这个现象的根本原因是：page-meta 的 page-style 写死成了静态的 overflow: hidden，没有跟随弹窗的打开/关闭状态动态切换。根据官方文档说明，由于平台自身原因，除 H5 平台外，其他平台都不能在组件内禁止滚动穿透，所以在微信小程序平台需要使用 page-meta 组件动态修改页面样式，由开发者自己处理。

你当前的写法中，overflow: hidden 是固定值，页面渲染和弹窗状态变化时不会动态更新，导致弹窗打开后页面滚动行为失控。正确做法是：在 data 中定义一个变量表示弹窗的开启关闭状态，通过这个变量动态修改 page-meta 的 overflow 属性，并在弹窗的状态回调中同步该变量。

参考代码如下：

<template>  
    <page-meta :page-style="'overflow:'+(show?'hidden':'visible')"></page-meta>  
    <view class="container">  
        <uv-popup ref="popup" @change="change">  
            <!-- 弹窗内容 -->  
        </uv-popup>  
    </view>  
</template>  
<script>  
    export default {  
        data() {  
            return {  
                show: false  
            }  
        },  
        methods: {  
            change(e) {  
                this.show = e.show  
            }  
        }  
    }  
</script>

本助手使用国产模型，生成代码可能不准确。专业的代码生成需要全球顶尖的AI Coding模型。推荐使用uni-agent

这样弹窗打开时页面 overflow 变为 hidden，底层页面无法滚动，从而阻止滚动穿透；弹窗关闭时恢复为 visible，页面可正常滚动。

另外需要注意几点：

1. page-meta 组件一个页面只能存在一个，请检查页面中是否有其他地方也使用了 page-meta，多个并存会导致样式相互覆盖。
2. 建议将 page-meta 放在页面根节点层级，不要嵌套在普通 view 内部，避免渲染异常。
3. 你使用的 @touchmove.stop 方式在微信小程序（尤其是 iOS 端）上无法可靠阻止滚动穿透，社区中也有类似反馈，建议以 page-meta 动态控制方案为主。
4. uv-popup 属于第三方组件库（uv-ui），并非 DCloud 官方维护的组件。如果按上述方式动态控制后，弹窗组件内部仍存在异常行为（比如 @change 事件未正常触发、状态值不对），建议联系该插件作者确认组件的事件回调是否规范。

详细说明可参考官方文档：uni-popup 禁止滚动穿透、微信小程序/App 平台处理方式

不是弹窗之后滚动失效，是弹窗之后滚动生效了，代码是最小问题复现