vue :class 判断失效问题

Question

vue的:class 判断问题，这边做了判断，但是class效果加不上去，刚开始做vue项目，真的很不懂，下面是有问题的代码，只留下了主要的部分，求个大神帮忙看看，蟹蟹蟹蟹

<style scoped>
.show_body dl{border-bottom:1px solid #eee;padding:.2rem 0;width:100%}
.show_body dl:last-child{border-bottom:1px solid #fff}
.show_body dl dd{font-size:.35rem;line-height:.65rem}
.show_body dl dt{padding:.12rem 0}
.show_body dl dt a{display:inline-block;border:1px solid #ccc;font-size:.25rem;padding:.1rem .2rem;margin-right:.15rem;margin-left:.15rem;border-radius:.1rem}
.show_body dl dt a.on{border:1px solid #ff9500;color:#fff;background:#ff9500}
</style>

<template>

<div class="show_body">
    <dl v-for="(specListlist,index) in info">
        <dd>{{specListlist.name}}</dd>
        <dt>
            <a v-for="(list,indexs) in specListlist.normsValues" :class="{on:indexclass[index]==indexs}"  @click="listOnclick(index,indexs,list)">{{list.name}}</a>
        </dt>
    </dl>
</div>

</template>

<script>

export default {

name:'goodsDetail',
data:function(){
      return {
        indexclass:[-1,-1,-1,-1,-1],
        info:[
            {"id": "1", "name": "颜色", "normsKey": 0, "normsValues": [
                {"id": 1, "name": "黑色", "normsKey": "NV0"},
                {"id": 2, "name": "白色", "normsKey": "NV1"}
            ]}, 
            {"id": "2", "name": "尺寸", "normsKey": 0, "normsValues": [
                {"id": null, "name": "S", "normsKey": "NV0"}, 
                {"id": null, "name": "M", "normsKey": "NV1"}, 
                {"id": null, "name": "L", "normsKey": "NV2"}]
            }
        ]
    }
},
methods: {
    listOnclick:function(a,b,c){
        this.indexclass[a]=b;
        console.log(this.indexclass,this.indexclass[a],b);
    
    }
}

}
</script>

试过了
:class="(indexclass[index]==indexs)?'on':''"
:class="{'on':indexclass[index]==indexs}"
都没有效果
这个是在线的代码，https://jsfiddle.net/94dum1gn/

Answer 1

把

this.indexclass[a]=b;

改为
this.$set(this.indexclass, a, b);

Answer 2

把 on 加个 '' 包起来 不然on 是个变量

Answer 3

<div class="show_body">
    <dl v-for="(specListlist,index) in info">
        <dd>{{specListlist.name}}</dd>
        <dt>
            <a v-for="(list,indexs) in specListlist.normsValues" :class="{'on':indexclass[index]==indexs}"  @click="listOnclick(index,indexs,list)">{{list.name}}</a>
        </dt>
    </dl>
</div>

class名需要用单引号包起来。