vue点击标签给一个class出现的问题，请各位给愚弟看一下

Question

我目前颜色和尺寸两个属性是是一下子遍历出来的导致，点击给一个样式只能6个中选一个，我想啊，颜色尺寸个选一个，有啥思路不，各位老哥

<div class="skin">
    <div v-for="(item,index) in configSpec">
        <div class="clear"></div>
        <div class="type">{{item.name}}:</div>
        <ul>
            <li v-for="(i,index) in item.list" :class='{active:currentBtn == i}' @click="checkBtn(i)">{{i}}</li>
        </ul>
    </div>
</div>
    
checkBtn(data){
    console.log(data);
    this.currentBtn === data
}

Answer 1

无非就是找6个中的唯一值

<div class="skin">
    <div v-for="(item,index) in configSpec">
        <div class="clear"></div>
        <div class="type">{{item.name}}:</div>
        <ul>
            <li v-for="(i,index1) in item.list" :class='{active:currentBtn === `${index}${index1}`}' @click="checkBtn(`${index}${index1}`)">{{i}}</li>
        </ul>
    </div>
</div>
    
checkBtn(data){
    console.log(data);
    this.currentBtn === data
}