關於小程序 scroll-view 左右橫向滑動沒有效果（沒法滑動）問題

小程序組件 scroll-view 中分別有上下豎向滑動和左右橫向滑動之分，在此次項目中恰好須要用到橫向滑動，但在測試過程當中發現橫向滑動沒有了效果（靜止在那裏沒移動過），經調試發現：

1.scroll-view 中的須要滑動的元素不能夠用 float 浮動；

2.scroll-view 中的包裹須要滑動的元素的大盒子用 display:flex; 是沒有做用的；

3.scroll-view 中的須要滑動的元素要用 dislay:inline-block; 進行元素的橫向編排；

4.包裹 scroll-view 的大盒子有明確的寬和加上樣式-->  overflow:hidden;white-space:nowrap;

具體的測試代碼以下：

<view class="scroll_box"> 

    <scroll-view class="scroll-view_x" scroll-x style="width: auto;overflow:hidden;">

      <view class="item_list" wx:for="{{list}}">
        <image src="../../images/head.jpg" class="item_book_img" mode="aspectFill"></image>
        <view class="item_book_text">測試數據</view>
      </view>
     
    </scroll-view>
  </view>

.scroll_box{

width: 100%;

height: 307rpx;

overflow: hidden;

padding: 20rpx;

background: #fff;

white-space: nowrap;

}

.item_list{

width: 160rpx;

height: auto;

margin-right: 23rpx;

display: inline-block;

}

獲得的具體效果以下：

 

以上內容供學習總結分享與討論，有什麼不對的地方或可優化的地方，歡迎各位多多指教。