1***@qq.com
1***@qq.com
  • 发布:2023-01-19 11:43
  • 更新:2024-01-28 02:27
  • 阅读:950

#插件讨论# 【 uni-data-select 下拉框选择器 - DCloud前端团队 】下拉框显示不全

分类:uni-app

uni-dta-select在uni-popup里面的话,下拉框选项会被挡住,显示不出来,这个怎么解决?

2023-01-19 11:43 负责人:无 分享
已邀请:
8***@qq.com

8***@qq.com

如果你是用uni-collapse,uni-card请这样设置,因为组件用了overflow: hidden;进行超出隐藏,其实并不对,应该是用visibility: hidden;这是组件的问题,解决方法如下

::v-deep .uni-collapse-item__wrap{  
    overflow: unset;  
    .uni-collapse-item__wrap-content{  
        visibility: hidden;  
        overflow: hidden;  
    }  
    .uni-collapse-item--border{  
        visibility: visible;  
        overflow: unset;  
        .uni-collapse-item__wrap{  
            overflow: unset;  
        }  
    }  
}
Avin

Avin - 前端小菜鸟

这个问题解决了吗,我在使用uni-card 包裹uni-data-select 的时候也出现了这种情况,下拉框显示不完整。修改uni-select__selector 的z-index 也不生效

2***@sina.com

2***@sina.com

查了半天也找不到解决办法啊,只能改成checkbox了

5***@qq.com

5***@qq.com

的确,UI的样式改动不了,压根不生效

5***@qq.com

5***@qq.com

这种下拉框在底部那个弹出就被挡住了,有什么办法解决么

套马杆的套子

套马杆的套子 - 没有解决不了的问题,只有解决不完的问题

如果是遮挡问题,找到uni_modules-uni-data-select-components-uni-data-select-uni-data-select.vue中,335行,z-index: 9999;//2从2改大就ok

  • 8***@qq.com

    根本不是这个问题,而是他这个组件外面如果有一个其他组件比如uni-card包裹,就会被overflow: hidden;这个属性挡了,主要是他的组件没有做独立于select外放置在body的功能

    2024-01-25 03:03

要回复问题请先登录注册