1.两种方法：

1.通过this.$refs来获取元素：

html 通过index给ref增加标识 :ref="`test${index}\`" <div class="continer" :ref="`test${index}`" v-for="(item,index) in data" :key="index" @click="isAction($event,index)">

姓名

{{item.name}}

年龄

{{item.age}}

js data(){ return{ data:[{name:"张三",age:18},{name:"张四",age:28},{name:"张五",age:38},{name:"张六",age:15},{name:"张七",age:13}], isdata:[], } }, methods: { isAction(e,i){ if(this.isdata[i]){ this.isdata.splice(i,1,null); this.$refs[`test${i}][0].style.backgroundColor= '#fff' }else{ this.isdata[i] = this.data[i]; this.$refs[test${i}`][0].style.backgroundColor= '#00f' }

    }
   }

2.用:class="{isAction:(!!isdata[index])}" + this.$set

html <div class="continer" :class="{isAction:(!!isdata[index])}" v-for="(item,index) in data" :key="index" @click="isAction(event,index)"> <div class="name"> <div><span>姓名</span></div> <div><span>{{item.name}}</span></div> </div> <div class="age"> <div><span>年龄</span></div> <div><span>{{item.age}}</span></div> </div> </div> css .isAction{ background: #00f; } js 因为data里数组值改变页面不变，后加的值没有被双向绑定，所以要用this.set( target , key , value) target: 要更改的数据源（可以是一个对象或者数组） key 要更改的具体数据 （索引） value 重新赋的值 data(){ return{ data:[{name:"张三",age:18},{name:"张四",age:28},{name:"张五",age:38},{name:"张六",age:15},{name:"张七",age:13}], isdata:[], } }, methods: { isAction(e,i){ if(this.isdata[i]){ this.set(this.isdata,i,null) }else{ this.set(this.isdata,i,this.data[i]) }

    }
 }