微信小程序之scroll-view的宽度问题

在.wxml文件中：

                <scroll-view class="recentScroll" scroll-x enable-flex>
                    <view wx:for="{{某个列表}}" wx:key="某个值">
                        <image src="{{某个值}}"></image>
                    </view>
                </scroll-view>

在.wxss文件中：

.recentScroll {
    display: flex;
    height: 200rpx;
}

.recentScroll image {
    position: relative;  /* 每个image要占据原来的位置。  */
    width: 200rpx;
    height: 200rpx;
    margin-right: 20rpx;
    border-radius: 10rpx; 
}

注意点：

1. scroll-view设置enable-flex或enable-flex=true后，使用flex布局才会有效果。
2. view是scroll-view的子元素，view大小由其内容决定，不能设置view的宽度。而每个image在同一位置（即第一个view内）重叠，其余view的宽度为0。给image设置position: relative后，每个image在每个view内，image横向排列。