vue动态绑定class

不同于三目运算符，这个方法对我来说还挺新颖的~

代码如下：

 
<div class="same_mask" :class="['level'+lightLevelInfo.level]">
 </div>



 .level1 {
        .mask_center {
            background: url('~@/static/images/index/index_01_mask.png') no-repeat;

            .mask_pthree {
                em {
                    color: #68bbf7;
                }
            }
        }
    }

    .level3 {
        .mask_center {
            background: url('~@/static/images/index/index_03_mask.png') no-repeat;

            .mask_pthree {
                em {
                    color: #a2e0b7;
                }
            }
        }
    }

lightLevelInfo.level为后端传递的值，值为1、2、3；

:class="['level'+lightLevelInfo.level]"等价于对应的:class="level1"。

也可以同时传多个类名：

 <div class="swiper-slide" v-for="(item,index) in levelData" :key="index" :class="['level'+item.level, userInfo.carInfo.level<item.level?'huibgc':'']">