vue中checked復選框，選中時改變背景色或者背景圖

使用van-checkbox-group包含van-cell去循環數據列表，而選中的van-cell需要改變背景圖，下面是個人的實現方式（簡單的一批，兩行代碼搞定）

html：因為vant的van-checkbox-group選中的數據會保存在一個數組中，所以用indexOf來判斷當前cell的某個值在數組中是否存在，不存在返回 -1，則當前cell的class為空，否則為自定義的類名

<van-checkbox-group v-model="checkedDev" checked-color="red"> 
        <van-cell-group>
          <van-cell v-for="(items, index) in DevList"
                    :title="items.deviceName"
                    :key="index"
                    :class="checkedDev.indexOf(items.machineCode) === -1 ? '' : 'red'" />
                    @click="toggle(index)">
            <template #right-icon>
              <van-checkbox :name="items.machineCode"
                            ref="checkDev"/>
            </template>
          </van-cell>
        </van-cell-group>
      </van-checkbox-group>

然后通過類名去設置背景圖或者背景色就可以啦~~~

css：

.van-cell.current_checked {
  background: url("../../../assets/images/monitor/empowerBg.png");
}

 效果圖：