vue如何动态绑定class

可以通过v-bind:class指令来动态绑定class。具体用法如下：

1. 直接绑定一个class名：

<div v-bind:class="{active: isActive}"></div>

这里的active是一个固定的class名，isActive是一个data中的布尔值，当isActive为true时，这个元素会自动添加active这个class。

2. 绑定多个class名：

<div v-bind:class="{active: isActive, 'text-danger': hasError}"></div>

这里的active和isActive的作用同上，'text-danger'是一个自定义的class名，当hasError为true时，这个元素会自动添加text-danger这个class。

3. 绑定一个class对象：

<div v-bind:class="classObject"></div>

这里的classObject是一个对象，里面的key为class名，value为布尔值，当value为true时，这个元素会自动添加对应的class。

4. 绑定一个计算属性：

<div v-bind:class="classObject"></div>

...

data: {
  isActive: true
},
computed: {
  classObject: function () {
    return {
      active: this.isActive,
      'text-danger': !this.isActive
    }
  }
}

这里的计算属性classObject返回一个对象，里面的key和value和方法二类似，当isActive为true时，这个元素会自动添加active这个class，否则会添加text-danger这个class。