小程序swiper-item内容过多显示不全的解决方案
最近在项目遇到swiper高度不能自适应,导致swiper-item 里面的内容过多时只能显示一部分,最终解决方案:
<swiper current="{{currentTab}}" style="height: {{clientHeight?clientHeight+'px':'auto'}}"> <swiper-item> <scroll-view scroll-y="{{true}}" style="height: {{clientHeight?clientHeight+'px':'auto'}}" bindscrolltolower="scrollbot"> 内容放在这 </scroll-view> </swiper-item> </swiper>
swiper-item {
overflow: scroll;
}
最后在后台动态获得屏幕可视区域高度clientHeight即可
onLoad: function () { var that = this wx.getSystemInfo({ success: function (res) { that.setData({ clientHeight: res.windowHeight-177 }); } }) }
人生的成功不在于拿到一副好牌,而是怎样将坏牌打好。