uni-app实现横向滚动（scroll-view）

 实现效果：

实现代码：

<view class="swiper-container">
    <view class="swiper-container__box">
        <scroll-view scroll-x> 
            <block v-for="item in 100" style="" :key="item">
                <view class="image-box" style="border:1px solid green;">
                    <image src="/static/api.png" style="width: 100%;height: 100%;"></image>
			    </view>
		    </block>
	    </scroll-view>
	</view>
</view>
<style lang="scss">
    .swiper-container {
        .swiper-container__box {
            box-sizing: border-box;
            border:1px solid red;            
            width:100%;
            white-space: nowrap; // 横向滚动必要属性
            .image-box {
                display: inline-block; // 图片的外层定义成行内元素才可进行滚动
                width:100px;
                height:100px;
                border:1px solid green;
                image {
                    width:100%;
                    height:100%;   
                }
            }
        }
        // block 是必须定义的外层元素,否则无法进行横向滚动
    }
</style>