vue.js样式绑定

class

class和style是html元素的属性，用于设置元素的样式。我们可以 用v-bind来设置样式属性。Vue.js v-bind在处理class和style是，专门增强了它。表达式的结果练习除了字符串之外，还可以是对象或数组。

class属性绑定

我们可以为v-bind：class设置一个对象，从而动态的切换class：

示例1

例子中将 isActive 设置为 true 显示了一个绿色的 div 块，如果设置为 false 则不显示：

以上示例div class为：

示例2

text-danger 类背景颜色覆盖了 active 类的背景色：

以上示例div class为：

我们也可以直接绑定数据里的一个对象

示例3

text-danger 类背景颜色覆盖了 active 类的背景色：

示例3和示例2的渲染结果是一样的。