swiper里面套用list显示
发布于 5 年前 作者 natian 13919 次浏览 来自 问答
<swiper class="swiper" current="{{currentId}}" bindchange="bindChange" duration="300" style="height:{{swiperHeight}}px" >
  <swiper-item>
    <view class="schoollist">
      <block wx:for="{{items}}" wx:key="item">
        <view class="school-list">
          <navigator url="/pages/photo/photo?id={{item.id}}">
            <view class="school-list-info" index="{{index}}">
              <image class="school-list-photo" src="{{item.imageUrl}}"/>
              <text class="school-list-desc">{{item.content}}</text>
            </view>
          </navigator>
        </view>
      </block>
    </view>
  </swiper-item>
</swiper>

外部是一个swiper，内部是一个list，外部swiper实现多个list可以进行左右滑动切换，list进行展示数据。这时候list不能进行上下滑动，请问有人知道这是什么原因么？

下面是对应的WXSS文件

.swiper{
  display: block;
  width: 100%;
  overflow: hidden;
  margin: 0;
  border: 0;
  margin-top: 0px;
  background-color: #eaeaea;
}
.schoollist-head-img{
  width: 100%;
  height: 180rpx;
  padding: 20rpx;
  box-sizing: border-box;
}
.schoollist{
  margin-top: 20rpx;
  width: 750rpx;
  height:1550rpx;
}
.school-list-info{
  float: left;
  margin-left: 20rpx;
  margin-top: 20rpx;
  position: relative;
}
.school-list-photo{
  width: 350rpx;
  height: 250rpx;
  margin-bottom: 50rpx;
 
}
.school-list-desc{
  display: block;
  background-color: #000;
  color: #fff;
  position: absolute;
  bottom: 3%;
  left: 0;
  width: 94%;
  text-align: center;
  font-size: 25rpx;
  padding: 10rpx;
  opacity: 0.7;
}

1 回复

因为你套的不是scroll-view ~

回到顶部