list循环 点击当前对象 class类名添加

list: [    //一个简单的数组数据

{id : 1, name: '张三'},

{id : 2, name: '李四'},

{id : 3, name: '王五'},

]

num=2,//你需要第几个添加class类名

.blur{       //添加的class类名

color: red;

}

<ul>

//当item.id == num时,添加blur    show(item.id)相同的方法,不同的传参,点击后根据参数id判断哪一个添加class类名

<li v-for="item in list" :key="item.name" :class="{ 'blur': item.id == num}" @clicl="show(item.id)"></li>

</ul>

 

show(id){

   this.num = id

}