微信小程序-swiper-item下的列表高度问题解决

需求是实现头部的选项卡切换页面，手指左右滑动也可以实现切换页面，于是使用swiper实现功能，但是有一个页面涉及到了列表，代码写完之后发现swiper下的列表无法撑起swiper的高度，经过百度知道swiper的高度是固定的150px，因为swiper组件的元素swiper-item是设置了绝对定位的，所以里面的内容是无法撑开swiper的，解决办法：

1.在swiper-item里的内容加scaoll-view包装；

代码提示

wxml部分

<swiper class="swiper" current="{{currentData}}" bindchange="bindchange" indicator-dots="true" indicator-color="#2CC669" >
  <swiper-item> 
    <scroll-view scroll-y="true" class="scroll">
   <view>你的列表</view>
  </scroll-view>
  </swiper-item>
  <swiper-item>
    <view>你好呀</view>
  </swiper-item>
</swiper>

wxss部分

.topTabSwiper {
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  zoom: 1;
  height: 50px;

}
.swiper {
  width: 100%;
  height: calc(100vh - 50px);
}
.scroll{
  height: 100%;
}

这样就可以解决问题了啦~ 特此记录一下。