uniapp 使用了uview 的dropdown下拉菜单后出现页面无法滚动

最新推荐文章于 2024-04-27 13:01:21 发布
最新推荐文章于 2024-04-27 13:01:21 发布
阅读量652 收藏 1
点赞数 5
文章标签： uni-app
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_47517731/article/details/136443658
版权

 

在上面不难发现，当下拉菜单已经处于关闭状态时，class为 u-dropdown__content这一块的元素还是存在的，究极原因是只把这个元素的opacity置为0了，导致页面无法滚动

所以找到uview的dropdown文件进行如下处理，直接给它关闭时隐藏dom即可

 

走，带你去玩
关注
  • 5
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
uniapp使用uview组件实现省市区三级联动
06-29
uniapp使用uview组件实现省市区三级联动； 文件下载后，需要在项目中引入uview组件方可使用； 数据附带在文件中
vue_menubar.rar
04-29
本案例是模仿饿了么，实现横向导航栏，可以参考用，也可以直接插入到项目中，接口方面使用的是mockJS模拟接口
uni-app +uViewUI的u-dropdown遮罩和层级问题
HHHHH2187的博客
10-26 676
问题1：点击下拉菜单后出现多余的灰色遮罩，很影响外观，如下图所示。解决：找到node_modules/uview-ui/components/u-dropdown/u-dropdown.vue这个文件，找到这个u-dropdown__content__mask类名加上 opacity: 0;如下图示。
uni-app引入Vant 下拉菜单dropdown选择过后边的之后再选择前边的选项出现点击无效
Florenza的博客
03-25 906
找到 wxcomponents/vant-weapp/dropdown-item/index.wxml打开后找到after-enter和after-leave这两个事件，并改为驼峰命名：afterEnter和afterLeave即可！有遇到问题的小伙伴可以去试一试，看下是否能够解决！
uview 中 Dropdown 下拉菜单点击收回时出现部分高亮问题
m0_46694046的博客
09-29 988
原因： 源码中用的是opacity，通过切换透明度的方法 解决： 修改源代码： 在node_modules里的uview-ui->components->u-dropdown->u-dropdown.vue文件里定义是否显示遮罩层 data(){ return{ dropDownShow:false } } 最外层的容器上判断显示或隐藏 <view class="u-dropdown" :style="dropDownShow ? '...
uniapp uview1.0x 下拉选择fs-select，日期下拉选择u-picker 组件简单分装
weixin_46211267的博客
11-30 5867
uview组件 下拉 和 日期简单分装 u-select封装 <!-- 点击弹窗下拉选择 可 单/多 列--> <template> <view> <u-input input-align="right" :placeholder="`请选择 ${placeholder}`" v-model="valueLable" type="select" :select-open="show" @click="show = true" :border="border"
uView学习（持续更新中）
~~~的博客
08-01 3144
uView页面基础布局
uniapp Dropdown 下拉菜单无法滑动问题
weixin_43993613的博客
06-27 1329
uniappDropdown 下拉菜单无法滑动问题
uniapp：mosowe-dropdown下拉菜单
mosowe
04-15 943
另一个类型的下拉菜单，当列表长度大于50的时候自动开启虚拟滚动，兼容uniapp项目的V2/V3版本。
uniapp多功能选择器组件，类似于elementui，可搜索可下拉可清空（基于uView二次封装），支持各端兼容，非常好用！！！
qq_32058147的博客
06-07 9353
（1）因为组件基于uView二次封装，所以请安装uView组件，安装步骤请看uView官方文档。说明：@select方法可以在父组件拿到当前选择项的对象数据。废话不多说，先看视频！
uniapp+uview框架模板
12-03
uniapp+uview框架模板
前端开发模板+基于uniapp和uview+悉地吧源码（含独立后端）+供前端开发学习
05-12
1，前端代码使用uniapp+uview构建，后端用的thinkphp开发！同时涵盖多端（APP，H5，小程序等） 2，功能主要有分类信息发布，朋友圈分享等，可以后台自行添加分类 3，可以前往微信小程序搜索“悉地吧”，体验各项...
前端框架uniapp-uView配置好的初始化项目，导入可直接使用
11-17
下载安装：已下载安装SCSS、引入uView主JS库、在引入uView的全局SCSS主题文件、引入uView基础样式、配置easycom组件模式
手拉手带你实现基于Uniapp和uView，根据权限动态的修改底部菜单tabbar
07-08
项目源码
【uniapp/ucharts】采用 uniapp 框架的 h5 应用使用 ucharts（没有 uni_modules）
花间半盘棋
04-26 329
然后按照图片中 README 所写的方式在项目中进行导入；下载的文件是如图所示的路径；就可以正常显示图表啦。
使用uni-app开发app时遇到mqtt.js不可用的问题
Alan_Walker688的博客
04-24 958
使用uni-app开发app时遇到mqtt.js不可用的问题踩坑与记录。
uniapp视频播放器（h5+app）
最新发布
farme_guan的博客
04-27 869
这是关于一篇在uniapp使用video视频播放器，支持自定义播放器样式，支持手势操作，选集、倍数和清晰度切换，支持SRT字幕格式。
优雅实现uniapp返回上一页传参
meteorites的博客
04-26 372
优雅实现uniapp返回上一页传参
uniapp使用uView的骨架屏导致页面高度报错问题
07-25
你好！对于uniapp使用uView的骨架屏导致页面高度报错的问题，可以尝试以下解决方法： 1. 检查页面布局：确保页面布局正确，没有嵌套问题，且组件的高度设置正确。 2. 检查组件引入：确认骨架屏组件是否正确引入，是否有重复引入的情况。 3. 更新uView版本：检查uView的版本是否是最新的，如果不是，尝试更新到最新版本，可能会修复一些bug。 4. 检查组件属性：查看骨架屏组件的属性，确保没有设置不合理的高度或宽度，例如设置一个过大的高度值。 5. 尝试手动设置高度：如果以上方法都无效，你可以尝试手动设置页面的高度，例如在页面的onLoad或onReady生命周期函数中获取组件高度，并将页面高度设置为该值。 希望以上方法能够帮助你解决问题！如果还有其他疑问，请随时向我提问。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值