Vue v-for 时,单个元素class的控制
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><sc
·
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 作用到的元素的索引。
更多推荐
已为社区贡献3条内容
所有评论(0)