vue遍历的数据点击之后相对的变色
<divv-for="(item, index) in musicType":key="item.type":class="index == currentKey ? 'isActive' : 'types' + item.type"style="margin-left: 45px;cursor: pointer;"@click="changeType(item.type, index)".
·
<div
v-for="(item, index) in musicType"
:key="item.type"
:class="index == currentKey ? 'isActive' : 'types' + item.type"
style="margin-left: 45px;cursor: pointer;"
@click="changeType(item.type, index)"
type="text"
>
{{ item.name }}
</div>
data() {
return {
// 样式高亮
currentKey: 0,
//标签数据
musicType: [
{ type: 0, name: "全部" },
{ type: 7, name: "华语" },
{ type: 96, name: "欧美" },
{ type: 16, name: "韩国" },
{ type: 8, name: "日本" },
],
//上一次点击的分类(默认的是type-1)
prevType: "types" + 0,
};
},
changeType(typeId, index) {
// console.log(typeId, index);
this.currentKey = index;
this.queryInfo.type = typeId;
//赋值存储
this.prevType = "types" + typeId;
this.getNewMusic();
},
更多推荐




所有评论(0)