如何设置微信小程序scrollview为横向滚动

下面以图片为例：

<!--wxml代码-->
<scroll-view scroll-x="true" class="swiperImgList">
  <image src="../../../../images/imgnull.png"></image>
  <image src="../../../../images/imgnull.png"></image>
  <image src="../../../../images/imgnull.png"></image>
</scroll-view>

<!--wxss代码-->
.swiperImgList{
  width: 686rpx;
  display: flex;
  white-space: nowrap;
}
.swiperImgList image{
  width: 200rpx;
  height: 200rpx;
  margin-right: 24rpx;
}
/*
.swiperImgList>image{
  width: 200rpx;
  height: 200rpx;
  margin-right: 24rpx;
}
*/

主要注意点
1、scroll-x属性需要写上去

2、使用display:flex 让图片横向排列

3、使用 white-space: nowrap，让图片不换行

4、wxss样式中 经过踩坑发现 使用子选择符‘>’无效（例如：.swiperImgList>image 如wxss中注释的代码，相同样式却没有任何效果 目前问官方了还未回复，有答案了再追加上）解决方法可以使用后代选择符