可否将swiper的高度可以变得自适应?谢谢!
发布于 6 年前 作者 jing26 8478 次浏览 来自 问答

现在我用swiper做一些tab切换时,swiper的高度固定是150px,但是我的swiper-item里面内容的高度有时不止150px,我设置min-height是没有效果的,但是把swiper的高度设置为一个固定的死数据又不好,所以请官方能否让swiper 的高度变得可以自适应,谢谢!

10 回复

加style属性,给高度就是屏幕高度减去tab的高度

感谢反馈。这个问题考虑过,但目前我们暂无定论,原因主要是:如果可以自适应,那意味着很可能各个swiper-item的高度并不一致,要么留白要么有滚动条。你想要实现的效果是怎样的呢?

嗯嗯    之前试出来了   谢谢

<  swiper wx:for='{{array}}'  style  =  'height:{{ heights[index] || 50 }}px'  >  

      <  swiper-item  >  

          <  view  class  =  'getThisHeight'  >  

            ...这里放自适应内容  

          </  view  >  

      </  swiper-item  >  

</  swiper  >  


justifyHeight:   function  () {  

      let  that =   this  

      let  hs = []  

    wx.createSelectorQuery().selectAll(  '.  getThisHeight  '  ).boundingClientRect(  function  (rects) {  

        rects.forEach((v, i) => {  

            hs[i] = v.height  

        })  

        that.setData({  

            heights: hs,  

        })  

    }).exec()  

},

这种交互很常见。办法是让swiper占满屏幕除tab外剩下的部分,swiper-item里面放纵向的scroll-view。

这样做tab切换 ,  几个切换页面的 内容 上下滚动式同步 的   ,这个怎么解决呢?谢谢。

你是怎么让swiper占满屏幕除tab外剩下的部分的呢?min-height:100%;没用啊

官方不支持,可以自己手写轮播图,view标签是支持自适应的

scroll-view的高度必须固定才能滚动,这个不能自动吗?

@LastLeaf,非常感谢指导

回到顶部