当前位置:   article > 正文

随后记: uniapp uview u-dropdown 下拉菜单固定高度滑动不生效

随后记: uniapp uview u-dropdown 下拉菜单固定高度滑动不生效

使用u-dropdown 下拉组件 按照uview官网讲解使用 配置根本不生效

scroll-y="true" style="height: 200rpx;"

但是在下拉的时候,不能上下滑动 ,原因是自带的遮罩层挡住了


 

解决办法:在下拉菜单打开和关闭的时候,分别处理显示和隐藏遮罩层,并且单独给item高度
请参考:
重点:u-dropdown-item  单独给height  添加打开关闭事件,处理遮罩层显示影响,添加穿透样式

  1. <u-dropdown class="dropdown" :class="{'dis-none': !dropdownOpen}" @open="openDrops" @close="closeDrops">
  2. <u-dropdown-item height='400' v-model="selectFollow" :title="title" :options="optionsList" @change="changeSelectFollow"></u-dropdown-item>
  3. <u-dropdown-item height='400' v-model="selectStatus" :title="statusTitle" :options="statusList" @change="changeSelectStatus"></u-dropdown-item>
  4. </u-dropdown>
  1. openDrops(e) {
  2. this.dropdownOpen = true;
  3. },
  4. // 关闭筛选下拉
  5. closeDrops(e) {
  6. this.dropdownOpen = false;
  7. },
  1. .dis-none{
  2. ::v-deep .u-dropdown__content{
  3. display: none;
  4. }
  5. }



 

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/小丑西瓜9/article/detail/665402
推荐阅读