Эх сурвалжийг харах

优化:商品图片非正方形时显示问题

Martin 5 жил өмнө
parent
commit
6962a1d41c

+ 5 - 2
pages/cart/index.vue

@@ -24,7 +24,7 @@
           <radio class="radio" color="#fa2209" :checked="inArray(item.id, checkedIds)" />
         </label>
         <view class="goods-image">
-          <image class="image" :src="item.goods.goods_image" mode="widthFix"></image>
+          <image class="image" :src="item.goods.goods_image" mode="scaleToFill"></image>
         </view>
         <view class="item-content">
           <view class="goods-title twolist-hidden"><text>{{ item.goods.goods_name }}</text></view>
@@ -46,7 +46,8 @@
       </view>
     </view>
     <!-- 购物车数据为空 -->
-    <empty v-if="!list.length" :isLoading="isLoading" :custom-style="{ padding: '180rpx 50rpx' }" tips="您的购物车是空的, 快去逛逛吧">
+    <empty v-if="!list.length" :isLoading="isLoading" :custom-style="{ padding: '180rpx 50rpx' }"
+      tips="您的购物车是空的, 快去逛逛吧">
       <view slot="slot" class="empty-ipt" @click="onTargetIndex">
         <text>去逛逛</text>
       </view>
@@ -344,10 +345,12 @@
 
     .goods-image {
       width: 200rpx;
+      height: 200rpx;
 
       .image {
         display: block;
         width: 100%;
+        height: 100%;
         border-radius: 8rpx;
       }
     }

+ 1 - 1
pages/order/comment/index.vue

@@ -6,7 +6,7 @@
         <view class="goods-main">
           <!-- 商品图片 -->
           <view class="goods-image">
-            <image class="image" :src="item.goods_image" mode="widthFix"></image>
+            <image class="image" :src="item.goods_image" mode="scaleToFill"></image>
           </view>
           <!-- 商品信息 -->
           <view class="goods-content">

+ 1 - 1
pages/order/detail.vue

@@ -87,7 +87,7 @@
         <view class="goods-main" @click="handleTargetGoods(goods.goods_id)">
           <!-- 商品图片 -->
           <view class="goods-image">
-            <image class="image" :src="goods.goods_image" mode="widthFix"></image>
+            <image class="image" :src="goods.goods_image" mode="scaleToFill"></image>
           </view>
           <!-- 商品信息 -->
           <view class="goods-content">

+ 1 - 1
pages/order/index.vue

@@ -23,7 +23,7 @@
             <view class="goods-item" v-for="(goods, idx) in item.goods" :key="idx">
               <!-- 商品图片 -->
               <view class="goods-image">
-                <image class="image" :src="goods.goods_image" mode="widthFix"></image>
+                <image class="image" :src="goods.goods_image" mode="scaleToFill"></image>
               </view>
               <!-- 商品信息 -->
               <view class="goods-content">