uniapp在H5的滚动穿透如何解决?

1,205 阅读1分钟

场景:页面本身有滚动,弹出层也有scroll-view滚动,当弹出层的滚动到边界时,页面本身会进行错误的滚动!

官网方法 @touchmove.stop.prevent="() => {}",这个不适用于弹出层也有滚动的情况。

正确方式:

<tempate>
    // 这个是页面 只要给 wrapper设置高度 100vh overflow: scroll-y 就可以了(不建议全局给page body 设置)
    <view class="wrapper">
        <view class="content">
        ...
        </view>
    </view>
    
    // 这个是弹出层
    <u-popup class="pop">
        ...
    </u-popup>
</template>