uniapp瀑布流组件

组件components>waterfallFlow>waterfallFlow

<template>
	<view>
		<view class="flow-box" :style="'height: ' + loadingTop + 'rpx'" ref="flow_box">
			<!-- <empty v-if="newList.length === 0"></empty> -->
			<empty v-show="isShowEmpty"></empty>
			<view v-for="(item, index) in newList" :key="item.ProductId" class="item good_item"
				v-show="positionList[item.ProductId].imageLoad"
				:class="positionList[item.ProductId].right ? 'right' : 'left'"
				:style="{top: positionList[item.ProductId].top + 'rpx'}" @click="onPageJump(item.ProductId)">
				<view class="goods_img">
					<image :data-id="item.ProductId" @load="onImageLoad" :src="item.MainImageUrl_Real" mode="widthFix"  @error="imgerror($event, index)">
					</image>
				</view>
				<view class="title">{
  { item.ProductName }}</view>
				<!-- <view class="goods_cont">{
  {item.Desc}}</view> -->
				<!-- <view class="club" v-if="item.type">
					<text class="goods_money_old">原价 ￥{
  {item.MinPrice}} </text>
					<view class="goods_money members">
						<text class="members_bg">VIP</text> ￥ {
  {item.MemberPrice}}
					</view>
				</view>
				<view v-else class="goods_money">原价￥ {
  {item.MinPrice}}</view> -->
				<view class="club">
					<text class="goods_money_old">原价￥{
  {item.MinPrice}} </text>
					<view class="goods_money members">
						<text class="members_bg">高级会员</text> ￥{
  {item.MemberPrice}}
					</view>
				</view>
			</view>
		</view>
	</view>
</template>
<script>
	const defaultData = {
		// 起始距离（rpx）
		startTop: 0,
		// 除了图片和标题以外的高度（rpx）
		// contentHeight: 20 + 22 + 20 + 20 + 20 + 10,
		contentHeight: 112,
		// 瀑布流容器宽度（rpx）
		viewWidth: 350,
		// 标题可显示宽度（rpx）
		titleWidth: 300,
		// 标题文字大小（rpx）
		titleSize: 28,
		// 容器之间的间隔Y轴（rpx）
		viewSpace: 16,
		// 列表ID参数名称