点击就高亮，可以点亮多个。但是点击了js处理变了状态dom节点并没有改变啊。。。第一次点击高亮第二次取消高亮

  <el-col :span="6" class="grade" v-for="(item,i) in classes" :key="item.clsid">

<div class="grid-content bg-purple" :class="{'active':kindex[i]==true}"  @click="changeGrade(item,i,$event)" ref="grade">{ {item.classname}}</div>

</el-col>

就放一段代码演示：

首先这里的kindex是个数组。里面就是循环获得的.如果点击就把这个下标的数据变成true。

首先获取到kindex的初始值。他到底有几个还是看classes有几个。先全部赋值为false

this.kindex=this.classes.map(res=>{
                            return false;
            });

changeGrade(data,i,e){//切换班级
                this.kindex[i]=true;   //把点击的变成true