class绑定多个值 vue_vue动态绑定:class的几种方式

一、对象语法

1、给v-bind:class 设置一个对象，可以动态地切换class，例如：

var app = new Vue({

el:'#app',

data:{

isActive:true

}

})

最终渲染结果：

2、对象中也可以传入多个属性，来动态切换class。另外，:class可以与普通class共存，例如：

var app = new Vue({

el:'#app',

data:{

isActive:true,

isError:false

}

})

最终渲染结果(当数据isActive或isError变化时，对应的class也会更新)：

3、当:class的表达式过长或逻辑复杂时，还可以绑定一个计算属性，这是一种友好和常见的用法，一般当条件多于两个时，都可以使用data或者computed，例如：

var app = new Vue({