Ver Fonte

优惠券标签修改

yuwenjun1997 há 2 anos atrás
pai
commit
72cb829b7d

+ 8 - 3
pages/views/goods/components/goods-coupon-list/goods-coupon-list.vue

@@ -1,9 +1,11 @@
 <template>
     <view class="coupon-section">
         <view class="coupon-tags">
-            <view class="tag" v-for="item in couponList" :key="item.couponId">
-                <view class="coupon-label" v-text="item.couponTitle"></view>
-            </view>
+            <template v-for="(item, index) in couponList">
+                <view class="tag" v-if="index < 2" :key="item.couponId">
+                    <view class="coupon-label" v-text="item.couponTitle"></view>
+                </view>
+            </template>
         </view>
         <view class="more" @click="$emit('click')">
             <text>领券</text>
@@ -31,6 +33,9 @@ export default {
     background-color: #fff;
     .coupon-tags {
         width: 80%;
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: clip;
         .tag {
             display: inline-block;
             height: 30rpx;

+ 5 - 2
pages/views/goods/components/goods-coupon-section/goods-coupon-section.vue

@@ -4,11 +4,11 @@
             <view class="label">优惠券:</view>
             <view class="coupon-tags">
                 <template v-for="(item, index) in couponList">
-                    <view class="tag" v-if="index < 2" :key="item.couponId">
+                    <view class="tag" :key="item.couponId" v-if="index < 2">
                         <view class="coupon-label" v-text="item.couponTitle"></view>
                     </view>
                 </template>
-                <text class="ellipsis" v-if="couponList.length > 2">...</text>
+                <!-- <text class="ellipsis" v-if="couponList.length > 2">...</text> -->
             </view>
             <view class="iconfont icon-chakangengduo more"></view>
         </view>
@@ -43,6 +43,9 @@ export default {
             flex: 1;
             text-align: right;
             margin-right: 24rpx;
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: clip;
             .tag {
                 display: inline-block;
                 height: 30rpx;