v-for循环生成的盒子只改变当前选中的盒子的样式

1.给盒子添加动态属性:class="[index === isActive?'active-box':'choose-box']"

  <div   v-for="(item,index) in zyList"  :key="item.sid"  :class="[index === isActive?'active-box':'choose-box']"   @click="getKmList(item,index)">
                            <p>{{item.kskm}} 专业</p>
                            <div class="choose-content">
                                <el-button type="text" size="mini" icon="far fa-building" style="color:var(--base-color-text)">场次 <span class="num">{{item.ypcc}}</span></el-button>
                                <el-button type="text" size="mini" icon="far fa-user" style="color:var(--base-color-text)">已排人次 <span class="num">{{item.yprc}}/{{item.zrc}}</span></el-button>
                            </div>
                        </div>

2.控制选中的盒子的样式：this.isActive = index;

...
  data() {
            return {
				isActive:0, 
			}
 methods: {
 //盒子点击事件
		getKmList(e,index){
              this.kskm = e.kskm;
              this.isActive = index;
              getRequest(this.url.kmList,{kskm:this.kskm}).then(res=>{
                  if (res.status){
                      this.kmList = res.data;
                  }
              })
          },
 		}

3.css代码，准备两个样式切换就行

.active-box{
...
}
.choose-box{
...
}