From 18f835d43008233b139f1f766ec87c6ed0bb1fee Mon Sep 17 00:00:00 2001 From: peng <peng.com> Date: 星期三, 25 六月 2025 10:47:18 +0800 Subject: [PATCH] update 解决图片显示问题 --- pages/commodity-square/commoditySquare.vue | 79 +++++++++++++++++++++++++-------------- 1 files changed, 51 insertions(+), 28 deletions(-) diff --git a/pages/commodity-square/commoditySquare.vue b/pages/commodity-square/commoditySquare.vue index 6226f83..d7c7fad 100644 --- a/pages/commodity-square/commoditySquare.vue +++ b/pages/commodity-square/commoditySquare.vue @@ -8,17 +8,17 @@ <view class="left" style="width: 310rpx;"> <view class="commoditySquareItem" v-for="(item,index) in goodsList1" @click="goToGoodsInfo('goodsList1',item.id)"> - <video :src="item.goodsVideo" v-if="item.goodsVideo " v-show="item.show" :initial-time="0" + <!-- <video :src="item.goodsVideo" v-if="item.goodsVideo " v-show="item.show" :initial-time="0" :controls="false" object-fit="contain" :show-play-btn="false" :show-center-play-btn="false" @loadedmetadata="getvideoInfo($event,'goodsList1',index)" :ref="'video'+item.id" - :style="{width:item.width,height:item.height}"></video> - <image :src="item.thumbnail" v-if="item.goodsVideo ==null || item.goodsVideo == ''" + :style="{width:item.width,height:item.height}"></video> --> + <image :src="item.thumbnail" mode="aspectFill" class="goodsImg"> </image> <view class="goodsInfo"> - <view class="">{{item.goodsName}}</view> + <view class="goodsName">{{item.goodsName}}</view> <view class="priceInfo"> - <view class="">锟{item.price}}</view> + <view class="goodsPrice">锟{item.price}}</view> <view class="">宸插敭: {{item.buyCount}}</view> </view> </view> @@ -27,17 +27,17 @@ <view class="right" style="width: 310rpx;"> <view class="commoditySquareItem" v-for="(item,index) in goodsList2" @click="goToGoodsInfo('goodsList2',item.id)"> - <video :src="item.goodsVideo" v-if="item.goodsVideo " v-show="item.show" :initial-time="0" +<!-- <video :src="item.goodsVideo" v-if="item.goodsVideo " v-show="item.show" :initial-time="0" :controls="false" object-fit="contain" :show-play-btn="false" :show-center-play-btn="false" @loadedmetadata="getvideoInfo($event,'goodsList2',index)" :ref="'video'+item.id" - :style="{width:item.width,height:item.height}"></video> - <image :src="item.thumbnail" v-if="item.goodsVideo ==null || item.goodsVideo == ''" + :style="{width:item.width,height:item.height}"></video> --> + <image :src="item.thumbnail" mode="aspectFill" class="goodsImg"> </image> <view class="goodsInfo"> - <view class="">{{item.goodsName}}</view> + <view class="goodsName">{{item.goodsName}}</view> <view class="priceInfo"> - <view class="">锟{item.price}}</view> + <view class="goodsPrice">锟{item.price}}</view> <view class="">宸插敭: {{item.buyCount}}</view> </view> </view> @@ -96,6 +96,7 @@ pageSize: 12, pageNumber: 1, categoryId: null, + canFilter:true }, //鍟嗗搧鍙屽垪鏄剧ず goodsList1: [], @@ -165,19 +166,19 @@ }, async getgoodsData() { const goodsList = await getGoodsList(this.getGoodsParam); - const sts = await getSTSToken(); - const stsUrl = sts.data.data.endpoint - // 澶勭悊鏁版嵁 - goodsList.data.result.records.forEach(item => { - if (item.thumbnail !== '' && item.thumbnail !== null && item.thumbnail.indexOf('http') === - -1) { - item.thumbnail = stsUrl + '/' + item.thumbnail - } - if (item.goodsVideo !== '' && item.goodsVideo !== null && item.goodsVideo.indexOf( - 'http') === -1) { - item.goodsVideo = stsUrl + '/' + item.goodsVideo - } - }) + // const sts = await getSTSToken(); + // const stsUrl = sts.data.data.endpoint + // // 澶勭悊鏁版嵁 + // goodsList.data.result.records.forEach(item => { + // if (item.thumbnail !== '' && item.thumbnail !== null && item.thumbnail.indexOf('http') === + // -1) { + // item.thumbnail = stsUrl + '/' + item.thumbnail + // } + // if (item.goodsVideo !== '' && item.goodsVideo !== null && item.goodsVideo.indexOf( + // 'http') === -1) { + // item.goodsVideo = stsUrl + '/' + item.goodsVideo + // } + // }) //璁$畻涓や釜鏁扮粍鐨勯暱搴� 鐢ㄤ簬瑙e喅鐎戝竷娴佷袱杈归珮搴︿笉涓�鑷撮棶棰� //骞冲垎缁欎袱涓暟缁� const goodsSize = goodsList.data.result.records.length; @@ -317,11 +318,11 @@ flex: 1 } - .priceInfo { - margin-top: 10rpx; - display: flex; - justify-content: space-around; - } + // .priceInfo { + // margin-top: 10rpx; + // display: flex; + // justify-content: space-around; + // } // 澶勭悊鎶藉眽鍐呭婊氬姩 .scroll-view-box { @@ -370,4 +371,26 @@ // width: 500rpx; // z-index: 9999; } + .goodsInfo{ + margin-top: 10rpx; + box-sizing: border-box; + width: 100%; + display: flex; + flex-direction: column; + } + .goodsName{ + display: flex; + align-items: center; + justify-content: center; + } + .priceInfo{ + margin-top: 10rpx; + display: flex; + align-items: center; + justify-content: space-between; + } + .goodsPrice{ + color: red; + font-weight: bold; + } </style> \ No newline at end of file -- Gitblit v1.8.0