公告列表
公告列表
收藏
回答

swiper用flex:1来适应高度时，swiper-item高度继承默认150

代码大概如下

<view class="container">
    <view class="nav"></view>
    <swiper class="swiper">
        <swiper-item></swiper-item>
    </swiper>
</view>
.container {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content:flex-start;
}
.nav {
    width: 100%;
    min-height: 160rpx;
}
.swiper {
    flex: 1;
}

然后swiper-item的高度100%就是默认的150px了，无法做到自适应。这情况只在ios出现，android并不会。

回答关注问题邀请回答
收藏

8 个回答

  • LastLeaf
    LastLeaf
    2017-07-14

    感谢反馈。这属于iOS系统的bug，所有纵向的flex布局都会有类似问题，目前暂时没有办法解决，请避免这样使用。

    2017-07-14
    有用 1
    回复
  • 郭凯峰คิดถึง
    郭凯峰คิดถึง
    2017-07-14

    我解决了这个问题，去看一下吧，求官方置顶一下

    2017-07-14
    有用 1
    回复
  • 郭凯峰คิดถึง
    郭凯峰คิดถึง
    2017-07-14

    嘿嘿

    2017-07-14
    有用
    回复
  • 郭凯峰คิดถึง
    郭凯峰คิดถึง
    2017-07-14

    https://developers.weixin.qq.com/blogdetail?action=get_post_info&lang=zh_CN&token=1730769302&docid=fa962e46aa26431ac5dd4a8665ce04de

    //实验无数方法，终于可以啦，希望官方推荐

    2017-07-14
    有用
    回复
  • 郭凯峰คิดถึง
    郭凯峰คิดถึง
    2017-07-13

    我现在想做的就是ios和安卓做判断一下系统信息，不同的系统用不同的css样式，现在正试着改呐


    2017-07-13
    有用
    回复
  • SHINING诗永
    SHINING诗永
    2017-07-13

    这是因为flex为1的<swiper>实际还是没有高度的，只是弹性布局拉伸了。所以<swiper-item>继承的100%height并没有成功。

    我的两种解决办法：

    1. 强行给swiper加个高度，指定高度，如： height: 100%；

      但这样安卓会有其他问题，不过苹果倒好了，你可以小程序启动是根据当前手机系统来加这个指定heght。

    2. 放弃这种做法~

    2017-07-13
    有用
    回复
  • 郭凯峰คิดถึง
    郭凯峰คิดถึง
    2017-07-13

    遇到同样问题，解决没有

    2017-07-13
    有用
    回复
请 登录 后发表内容
相关问题
相关文档