vue addClass问题？

Question

我在代码里这样设计：
<span v-bind:class="{check:isCheck}" class="fa fa-check-circle normal"> </span>
当我点击某个按钮时，将isCheck设有true
this.isCheck = true
并且给span再增加一个class check-icon
d.classList.add('check-icon') //d为span

这两句代码在同一个函数内，但是最后我只添加了check一个class，为什么？
如果我d.classList.add('check-icon') 单独执行则可以添加。

Answer 1

数据驱动更新的时候，整个dom是重新渲染的，相当于你js添加类名之后，vue又重新创建了一遍dom，把原来的覆盖掉了。
class可以绑定多个值的啊，为社么要操作dom。、

---

<li 
 @click="addIcon(item)" 
 v-for="(item, index) in list" :key="index" 
 :class="[true ?'big': 'small', item.class]"> //用这种方式绑定，可以控制
  {{item.name}}
</li>

list: [
    { name: 1 },
    { name: 2 },
    { name: 3 },
    { name: 4 }
]
addIcon (item) {
  this.$set(item, 'class', 'red') // list中没有class属性，所以需要借助$set动态添加才能响应
}