还是对vue的不够熟悉,试了很久才想通的,有时候思维就固定在一个方法,不会转弯,还是要多思考多看
1。v-for循环后要点击两个按钮切换显示不同的div
<span @click="transferShow(index)" :class="activeIndex===index?'isActive':''">划转</span>
<span @click="InwardShow(index)" :class="activeInward===index?'isActive':''">内转</span>
2. 在两个div上加上设定的值
<div class="transfer" v-show="activeIndex===index"></div>
<div class="Inward" v-show="activeInward === index"></div>
data() {
return {
activeIndex: -1,
activeInward: -1,
}
}
methods{
transferShow(index) {
this.activeIndex = this.activeIndex == index? -1 : index
this.activeInward = -1
},
InwardShow(index){
this.activeInward = this.activeInward == index? -1 : index
this.activeIndex = -1
},
}