uniapp中uni-popup在小程序中滚动穿透问题

uniapp中uni-popup在小程序中滚动穿透问题

官网例子
使用场景,在小程序中一个页面内容很长,点击某一项需要弹框,这个弹框需要定位在一定位置,下面的页面不需要滚动
1.直接在模板中添加

复制代码
<template>
   <page-meta :page-style="controlStyle" ></page-meta>
</template>

2在data中定义数据

复制代码
 data() {
    return {
        controlStyle: 'overflow:auto',
    }
  },

3.在触发弹窗打开的时候赋值

复制代码
 this.controlStyle = 'overflow:hidden'

4.弹窗关闭时再次赋值回来,保证页面正常滚动

复制代码
 this.controlStyle = 'overflow:auto'
相关推荐
流***陌8 小时前
扭蛋机 Roll 福利房小程序前端功能设计:融合趣味互动与福利适配
前端·小程序
亮子AI11 小时前
【小程序】微信小程序点击效果(view、button、navigator)
微信小程序·小程序
Q_Q51100828511 小时前
python+uniapp基于微信小程序团购系统
spring boot·python·微信小程序·django·uni-app·node.js·php
future_studio12 小时前
聊聊 Unity(小白专享、C# 小程序 之 加密存储)
开发语言·小程序·c#
炒毛豆12 小时前
uniapp微信小程序+vue3基础内容介绍~(含标签、组件生命周期、页面生命周期、条件编译(一码多用)、分包))
vue.js·微信小程序·uni-app
從南走到北12 小时前
洗车小程序系统
微信小程序·小程序
dazhong201214 小时前
微信小程序开发实战指南(三)-- Webview访问总结
微信小程序·小程序
计算机毕业设计小帅14 小时前
【2026计算机毕业设计】基于Springboot的校园失物招领小程序
spring boot·小程序·课程设计
盛夏绽放16 小时前
关于 uni-app 与原生微信小程序中的生命周期 —— 一次“生命旅程”的解读
微信小程序·小程序·uni-app
流水线上的指令侠17 小时前
使用C#写微信小程序后端——电商微信小程序
微信小程序·小程序·c#·visual studio