微信小程序瀑布流实现，瀑布流长度不均等解决方法

这是一开始实现的瀑布流，将数据分为奇数列和偶数列

<view class="content-left"><block wx:for="{{list}}" wx:key="list"><template is='item-data' data='{{...item}}' wx:if="{{index % 2 ==0}}"></template></block>
</view>
<view class="content-right"><block wx:for="{{list}}" wx:key="list"><template is='item-data' data='{{...item}}' wx:if="{{index % 2 ==1}}"></template></block>
</view>

但是这样，瀑布流的两边的图片分布不同，有横着的图片和竖着的图片，导致了两边的长短不同，不美观

解决方法：使用微信自带的 scroll-view组件即可解决

官方文档：scroll-view | 微信开放文档

<scroll-view type="custom" scroll-y style="box-sizing:border-box;"><grid-view type="masonry" main-axis-gap="{{10}}" cross-axis-gap="{{10}}"><block wx:for="{{list}}" wx:key="list"><view><template is='item-data' data='{{...item}}'></template></view></block></grid-view></scroll-view>

scroll-view可以自动依据长度，分布瀑布流的内容，让瀑布流的两边长度接近。