vue.js li根据获取到不同的数据显示不同的样式

<li 
              v-for="site in goodsList" 
              :key="site.id"
              :class= "site.label2? 'list2' : 'list1'"
            >

 .list .list1{
       width: 856px;
      height: 111px;
      background: url('~@/assets/img/list2.png') left top no-repeat;
    }
    .list .list2{
       width: 856px;
      height: 178px;
      background: url('~@/assets/img/list.png') left top no-repeat;
    }

li在循环的时候判断接口返回的某字段有无值显示不同的大小以及背景图片，刚开始想的是用v-if去判断然后给不同的样式，后面知道当 v-if 与 v-for 一起使用时，v-for 具有比 v-if 更高的优先级，这意味着 v-if 将分别重复运行于每个 v-for 循环中

所以，不推荐v-if和v-for同时使用。