vue class动态样式

Vue中可以使用动态样式类来实现样式的动态切换。有两种常见的方式可以实现动态样式类的绑定。

1. 使用对象语法：

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

在这个例子中，`:class`是`v-bind:class`的缩写，`{ active: isActive }`是一个对象，`active`是样式类名，`isActive`是一个布尔值，当`isActive`为`true`时，`active`样式类将被应用到`div`元素上。

2. 使用对象绑定：

<div :class="classObject"></div>

在这个例子中，`:class`是`v-bind:class`的缩写，`classObject`是一个对象，它包含了需要动态切换的样式类名和对应的布尔值。在Vue组件的`data`选项中定义了`classObject`对象，其中的属性名是样式类名，属性值是布尔值。当属性值为`true`时，对应的样式类将被应用到`div`元素上。

这两种方式都可以实现动态样式类的绑定，具体使用哪种方式取决于你的需求和个人偏好。