1***@qq.com
1***@qq.com
  • 发布:2019-07-05 09:27
  • 更新:2020-05-19 12:24
  • 阅读:2476

swiper高度无法在原生app下自适应

分类:uni-app

1、利用flex布局,使swiper高度自适应,h5与微信端无问题,原生app无法自适应。
2、代码截图


3、各端截图(从上至下原生app、h5端、微信小程序端)

有人遇到这个问题解决了吗?

2019-07-05 09:27 负责人:无 分享
已邀请:

最佳回复

DCloud_UNI_GSQ

DCloud_UNI_GSQ

经过测试,flex 在不同版本的浏览器内核上表现确实有差异(H5在你这个测试机上应该也有同样问题)
兼容方式:给 swiper 设置 height: 100%;
另外:vh、vw 也需慎用,在低版本浏览器内核上也不支持

  • 1***@qq.com (作者)

    不好意思,没有给项目源测试工程,这个是临时写的,您说的设置100%在现在上传的测试工程里没问题,但在我项目里面我之前也试过的,100%后完全看不到整个页面,h5与微信端可以看到。只有设置具体的px或upx才可以看到,但设置upx后我发现各手机端也并不能完全适应,以至于后面加载抽屉插件后会有显示问题,我再上传我的项目测试工程rox-skguide-app。

    2019-07-08 16:30

  • DCloud_UNI_GSQ

    回复 1***@qq.com: 你每次所谓的H5可以,可能是特指的PC版Chrome模拟,如果使用系统webview应该存在同样问题。注意:组件height: 100%依赖于page设置height: 100%,组件动态绑定的style内使用upx在alpha 2.0.4才支持

    2019-07-08 17:09

  • 1***@qq.com (作者)

    回复 DCloud_UNI_GSQ: 这我知道,已经用其他方式解决了,谢谢~

    2019-07-08 17:31

  • l***@163.com

    回复 1***@qq.com:问下是如何解决的,遇到同样问题

    2019-10-17 16:26

DCloud_UNI_GSQ

DCloud_UNI_GSQ

请上传一个测试工程

  • 1***@qq.com (作者)

    已上传到回复区

    2019-07-08 12:57

1***@qq.com

1***@qq.com (作者)

测试工程

h***@163.com

h***@163.com

同样遇到了 有人解决了嘛

风云杭州

风云杭州

遇到同样问题,nvue 的swiper 的高度貌似不太好变

该问题目前已经被锁定, 无法添加新回复