问题描述：

如果含有两个一下的商品且商品id大于2就会不显示

相关截图：

cartList.vue

<template>
<div class="wrapper">
    <div class="title">我的全部购物车</div>
    <div class="carts">
        <div
        class="cart"
        v-for="(cart,key) in cartList"
        :key = key
        @click="() => handleCartClick(key)"
        v-show="cart.total"
        >
            <div class="cart__title">{{cart.shopName}}</div>
            <div class="cart__list">
                <template
                v-for="(product,innerIndex) in cart.productList"
                :key="innerIndex">
                    <div
                    class="cart__item"
                    v-show="product.count && innerIndex < 3"
                    >
                        <img :src="product.imgUrl" class="cart__item__img">
                        <div class="cart__item__detail">
                            <h4 class="cart__item__title">{{product.name}}</h4>
                            <p class="cart__item__price">
                              <span class="cart__item__single">
                                <span class="cart__item__price__yen">¥</span>{{product.price}} x {{product.count}}
                              </span>
                              <span class="cart__item__total">
                                <span class="cart__item__price__yen">¥</span>{{(product.price*product.count).toFixed(2)}}
                              </span>
                            </p>
                        </div>
                    </div>
                </template>
            </div>
            <div class="cart__total" v-if="Object.keys(cart.productList).length>=2">共计{{cart.total}}件</div>
        </div>
    </div>
    <div
    class="empty"
    v-if="Object.keys(cartList).length === 0 || show ==0"
    >
      购物车为空
    </div>
</div>
<Docker :currentIndex="1"/>
</template>
<script>
// import { computed } from 'vue'
// import { useStore } from 'vuex'
import Docker from '../../components/Docker.vue'
import { useRouter } from 'vue-router'
import { ref } from 'vue'
// 处理购物车的逻辑
const cartListEffect = () => {
  const router = useRouter()
  const cartList = JSON.parse(localStorage.cartList || '{}')
  const show = ref(0)
  for (const i in cartList) {
    const cart = cartList[i]
    let total = 0
    for (const j in cart.productList) {
      const product = cart.productList[j]
      total += product.count
      if (product.count <= 0) {
        delete cart.productList[j]
      }
    }
    cart.total = total
    if (total !== 0) {
      show.value = 0
    }
  }
  const handleCartClick = (shopId) => {
    router.push(`/orderConfirmation/${shopId}`)
  }
  return { cartList, handleCartClick, show }
}
export default {
  components: { Docker },
  name: 'CartList',
  setup () {
    const { cartList, handleCartClick, show } = cartListEffect()
    console.log(cartList)
    return { cartList, handleCartClick, show }
  }
}
</script>
<style lang="scss" scoped>
@import '../../style/variables.scss';
@import '../../style/mixins.scss';
.wrapper {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0.5rem;
  color: $content-fontcolor;
  overflow-y:auto ;
  background-color: $bg-color;
}
.title {
    line-height: .22rem;
    font-size: .16rem;
    color: $content-fontcolor;
    text-align: center;
    background-color: $white-fontColor;
    padding: .11rem 0;
}

.carts {
  margin: 0 .18rem .2rem .18rem;
  position: absolute;
  top: .60rem;
  left: 0;
  right: 0;
   .cart {
    //  overflow-y:scroll ;
     margin-bottom: .16rem;
     background-color: $white-fontColor;
     padding-bottom: .16rem;
     &__list {
         overflow-y: scroll;
         background-color: $white-fontColor;
     }
     &__title {
       font-size: .14rem;
       line-height: .22rem;
       color: $content-fontcolor;
       padding: .16rem;
         background-color: $white-fontColor;
     }
     &__item {
           position: relative;
           display: flex;
           padding-bottom: .16rem;
           margin: 0 .16rem;
           &__img {
               width: .46rem;
               height: .46rem;
               margin-right: .16rem;
           }
           &__title {
               line-height: .2rem;
               font-size: .14rem;
               color: $content-fontcolor;
               margin: 0;
               @include ellipsis;
           }
           &__detail {
               overflow: hidden;
               flex: 1;
           }
           &__price {
               line-height: .2rem;
               font-size: .14rem;
               color: $hignlight-fontColor;
               margin: .06rem 0 0 0;
               display: flex;
               &__yen {
                   font-size: .12rem;
               }
           }
           &__total {
             flex: 1;
             text-align: right;
             color: #000;
           }
       }
     &__total {
      line-height: .28rem;
      text-align: center;
      font-size: 14px;
      color: $light-fontColor;
      background-color: $search-bgColor;
      margin: 0 .16rem ;
     }
   }
}
.empty {
  text-align: center;
  font-size: .16rem;
  color: $light-fontColor;
  margin-top: .3rem;
}

</style>

我已经提交过作业啦，老师可以看我提交的作业的代码。