微信小程序 scroll-view 横向滚动问题

主要2点

1  scroll-view  设置 scroll-x="true"   style="100%"    white-space:nowrap;

2  子元素 设置 display:inline-block;

index.wxml

   <scroll-view scroll-x="true" class="scroll_view" >
          <view class="text1" style="background:red">111</view>
          <view class="text2"  style="background:orange">2222</view>
          <view class="text3"  style="background:blue">3333</view>
    </scroll-view>

index.wxss

.scroll_view{
  width: 100%;
  /* display:flex; */
  height: 200rpx;
  white-space: nowrap;
}
.text1,.text2,.text3{
  display:inline-block;
  width: 750rpx;
  height: 200rpx;
}