javascript - vue 如果判断checked是否选中状态？

Question

 <li class='caseList' v-for="(items, index) in itemsOne">
      <span>
             <input type="checkbox" v-bind:id="'itemsOne'+index" :value="items.id" v-model="checkedNames">
             <label class="labelCase" :for="'itemsOne'+index">{{items.title}}</label>
      </span>
     <i class="icon iconfont icon-checked">这里如果input选中icon-checked不显示</i>
 </li>

在checkedlist中如果当前的input是选中的状态，那么icon-checked就不显示；

Answer 1

这样？

<i class="icon iconfont" :class="{'icon-checked': !checkedNames}">这里如果input选中icon-checked不显示</i>

update:

如果checkNames是数组，我想了一个办法，不过数组元素最好是唯一才行

因为你这里是把input的值选中后填入到checkedNames数组去，那我们判断class的时候检查值是否存在于数组即可

<i class="icon iconfont" :class="{'icon-checked': checkNames.indexOf(item.id)==-1}">这里如果input选中icon-checked不显示</i>

大概例子
https://jsfiddle.net/dont27/L...