商品列表去除瀑布流

pages/goods/list.vue

@@ -109,9 +109,9 @@
 					</view>
 				</view>
 				<view v-else>
-					<u-waterfall v-model="list.data" ref="uWaterfall1">
+					<!-- <u-waterfall v-model="list.data" ref="uWaterfall1"> -->
-						<template v-slot:left="{leftList}">
+						<!-- <template v-slot:left="{leftList}"> -->
-							<view class="goods-item goods-item1" v-for="(item, index) in leftList" :key="index"
+							<view class="goods-item goods-item1" v-for="(item, index) in list.data" :key="index"
 								@click="onTargetDetail(item.goods_id)">
 								<!-- 多列显示 -->
 								<view class="">
@@ -165,23 +165,19 @@
 									</view>
 								</view>
 							</view>
-						</template>
+						<!-- </template> -->
-						<template v-slot:right="{rightList}">
+						<!-- <template v-slot:right="{rightList}">
 							<view class="goods-item goods-item1" v-for="(item, index) in rightList" :key="index"
 								@click="onTargetDetail(item.goods_id)">
-								<!-- 多列显示 -->
 								<view class="">
-									<!-- 商品图片 -->
 									<view class="goods-image">
 										<image class="image" mode="aspectFill" :src="item.goods_image"></image>
-										<!-- <u-lazy-load threshold="0" border-radius="10" image-mode="aspectFill" :loading-img="item.goods_image" :image="item.goods_image" :index="index"></u-lazy-load> -->
+										<u-lazy-load threshold="0" border-radius="10" image-mode="aspectFill" :loading-img="item.goods_image" :image="item.goods_image" :index="index"></u-lazy-load>
 									</view>
 									<view class="detail" style="padding-top: 10rpx;">
-										<!-- 商品名称 -->
 										<view class="goods-name">
 											<text>{{ item.goods_name }}</text>
 										</view>
-										<!-- 商品价格 -->
 										<view class="shenBox">
 											<view class="detail-price oneline-hide">
 												<text class="goods-price f-30 col-m"><text
@@ -194,12 +190,12 @@
 												mode="">
 											</image>
 										</view>
-										<!-- 	<view class="goodsInfo" v-if="item.cmmdty_model">
+											<view class="goodsInfo" v-if="item.cmmdty_model">
 											<view class="oneTip">
 												{{item.cmmdty_model}}
 											</view>
-										</view> -->
+										</view>
-										<!-- <view class="goodsSend">
+										<view class="goodsSend">
 											<view class="sendLeft">
 												<view class="left_1">
 													{{item.goods_source}}
@@ -217,12 +213,12 @@
 												<text v-if="item.delivery_time==5">30天内发货</text>
 												<text v-if="item.delivery_time==6">45天内发货</text>
 											</view>
-										</view> -->
 										</view>
 									</view>
 								</view>
-						</template>
+							</view>
-					</u-waterfall>
+						</template> -->
+					<!-- </u-waterfall> -->
 				</view>
 				<view style="margin-top: 250rpx;" v-if=" total == 0">
 					<u-empty text="暂无数据显示哦～" mode="list"></u-empty>
@@ -327,7 +323,7 @@
 			multiChange(e) {
 				this.multiIndex = Number(e.detail.value)
 				// 刷新列表数据
-				this.$refs.uWaterfall1.clear();
+				// this.$refs.uWaterfall1.clear();
 				this.list.data = []
 				this.list = []
 				//this.list = getEmptyPaginateObj()
@@ -348,7 +344,7 @@
 								if (this.options.categoryId) {
 									that.onChage(that.tabbar[0], 1, 0)
 								} else {
-									this.$refs.uWaterfall1.clear();
+									// this.$refs.uWaterfall1.clear();
 									this.list.data = []
 									this.list = []
 									this.mescroll.resetUpScroll()
@@ -390,7 +386,7 @@
 						this.keyName2 = item.name
 					}
 				}
-				this.$refs.uWaterfall1.clear();
+				// this.$refs.uWaterfall1.clear();
 				this.list.data = []
 				this.list = []
 				this.mescroll.resetUpScroll()
@@ -481,7 +477,7 @@
 				if (newSortType != 'city') {
 					const newSortPrice = newSortType === 'price' ? !app.sortPrice : true
 					app.sortPrice = newSortPrice
-					app.$refs.uWaterfall1.clear();
+					// app.$refs.uWaterfall1.clear();
 					app.list.data = []
 					app.list = []
 					app.mescroll.resetUpScroll()
@@ -741,6 +737,11 @@
 
 	// 平铺显示
 	.goods-list.column-2 {
+		>view {
+			display: flex;
+			justify-content: space-between;
+			flex-wrap: wrap;
+		}
 		.goods-item {
 			// width: 50%;
 		}
@@ -753,7 +754,7 @@
 	.goods-item {
 		background: #FFFFFF;
 		box-sizing: border-box;
-		margin: 20rpx 14rpx 0rpx 0;
+		margin: 20rpx 0 0rpx 0;
 		border-radius: 8rpx;