關於vue中如何實現排到他思想


最近在做vue項目需要做到排他思想,本來如果用jq做很簡單的一件事,到了vue里面也是挺簡單的(<li v-for="(listRenderingList,index) in listRenderingLists" v-on:click="onclick(index)" v-bind:class=" {active:index==dynamic}">{{index}})。這種寫法相信很多人都會寫,這種寫法對於我這項目還是有bug,具體bug就是,后台返回的數據格式,本來后台返回的格式也沒毛病,就是用這種判斷添加一個類不能滿足我的項目,讓我糾結。故此寫一下思路

0 bug

 

 

1 后台返回的數據格式,這種格式渲染起來非常簡單

2 動態給生成的li注冊點擊事件

<li class="lis_color" v-for="(item ,index) in val.list" :key="index"
@click="changebgcolor3(item,index,topindex)" v-bind:class="{changebgcolor:selectchangeclass(curindex,curtopindex,index,topindex)}" >
3 方法里面寫判斷,這樣完美解決了排他思想
selectchangeclass(curindex,curtopindex,index,topindex){
if(curindex===index&&topindex==curtopindex){
return true;
}
},
changebgcolor3(item,index,topindex) {
this.curindex = index;
this.curtopindex = topindex;
 
},


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM