scroll-view无法滚动

开发十年，就只剩下这套架构体系了！ >>>   

微信小程序中的scroll-view组件的使用（横向滚动）

1. 需要将srcoll-view的父元素设置宽度，以及ovflow: hidden;white-space: no-wrap;

2. 滚动元素设置为display: inline-block;

代码：

view class="scroll-wrapper">
    <scroll-view scroll-x="{{true}}" style="height: 140rpx;">
        <image class="scroll-item" src="../../../assets/images/class/small/1.jpg"></image>
        <image class="scroll-item" src="../../../assets/images/class/small/2.jpg"></image>
        <image class="scroll-item" src="../../../assets/images/class/small/3.jpg"></image>
        <image class="scroll-item" src="../../../assets/images/class/small/1.jpg"></image>
        <image class="scroll-item" src="../../../assets/images/class/small/2.jpg"></image>
        <image class="scroll-item" src="../../../assets/images/class/small/2.jpg"></image>
        <image class="scroll-item" src="../../../assets/images/class/small/2.jpg"></image>
    </scroll-view>
</view>

样式：

.scroll-wrapper {
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
}

.scroll-item {
  width: 140rpx;
  height: 140rpx;
  border-radius: 12rpx;
  margin-right: 16rpx;
  display: inline-block;
}

.scroll-item:last-child {
  margin-right: 0;
}