css中动态类名：使用对象绑定

// html中
<div :class="{ active: isActive, sort: isSort }">字体颜色</div>
// data中
 data() {
    return {
       isActive: true,
      isSort: false,

}
//style中
<style>
.active {
  color: red;
}
</style>

理解：
isActive为true,active类有效，isSort为false,sort类无效。

注：最终效果是：

<div :class="active">字体颜色</div>

最终效果：