uni-app双排一起滑动--两行同步滑动

效果如下所示，就是两行列表同步滑动：

这个横向滚动肯定还是用scroll-view组件，重要的是里面item样式排列，要用到flex布局：

<scroll-view class="nav-bar" scroll-x>
    <!-- 要想使用flex布局实现横向滚动，就要在scroll-view里加一层容器block包裹，并且使用子组件才会出现滚动效果 -->
    <view class="nav-bar-wrap">
      <block  v-for="(item, index) in recoverArr" :key="index">
        <view class="nav-bar-item">
         	...  ...
	  
        </view>
      </block>
    </view>
</scroll-view>


scroll-view {
 white-space: nowrap;
}
/* 去除滚动条 */
::-webkit-scrollbar {
  display:none;
  width:0;
  height:0;
  color:transparent;
}
.nav-bar-wrap {      //  关键的样式
  display: flex;
  flex-flow: column wrap;
  height: 400rpx;
}
.nav-bar-item {
  width: 400rpx;
  display: flex;
  height: 170rpx;
  margin-top: 18rpx ;
  position: relative;
}

ok，然后就阔以看到效果了。