Vue v-for 时,单个元素class的控制
只要一句表达式,加一个控制控制变量
<template>
<ul>
<li v-for="(item,index) in arr" :class="{red:index==indexPrev}"
v-on:click="changeColor(index)">{{item}}</li></ul>
</template>
<script>
export default {
data(){
return {
arr:['0','1','3'],
indexPrev:1
}
},
methods:{
changeColor(index){this.indexPrev=index}
}
}
</script>
<style>
.red{color:red}
</style>
:class=”{red:index==indexPrev}” 其中indexPrev 为class 作用到的元素的索引。