微信小程序: swiper 的 swiper-item 下 scroll-view 无法滚动

微信开发工具 v1.02.1802080

swiper-item 和 scroll-view 及其中间的所有 view 都需要设置 height: 100%;

设置具体初始高度: style="height:{{winHeight}}px"

如果仍然有问题, 需要设置scroll-view的滚动方向 :

scroll-x="false" 
scroll-y="true"

示例代码:

wxml 中:

<swiper current="{{currentTab}}" 
        style="height:{{winHeight - 31}}px"  
        class="swiper-box" 
        duration="300">
  
  <swiper-item class="swiper-items">
    <scroll-view scroll-x="false" scroll-y="true" class='scroll-views'>
        <block wx:for="{{items}}" wx:key="col_{{index}}"> 
          <template is="undertookCard" data="{{...item}}"/>
       block>  
    scroll-view>
  swiper-item> 
swiper>

wxss 中;

.swiper-box{ 
    display: block; 
    width: 100%; 
    height: 100%; 
    margin-top: 92rpx; 
    overflow: hidden;
}  
.swiper-items{
  height: 100%;
}
.scroll-views{
  height: 100%;
}

你可能感兴趣的:(微信小程序)