vue点击切换class改变样式

原文链接https://www.cnblogs.com/xueweijie/p/6861702.html

.iconColor{
	color: #409EFF;
}

<li v-for="(item, index) in list" :key="index">
	{{item.date}}
	<i v-show="item.value.length>0" class="el-icon-circle-plus-outline" :class="{ iconColor:keyIndex===index && show }" @click="change(index)"></i>
	<div v-for="(value, index1) in item.value" v-show="show && keyIndex === index" :key="index1">
		{{value.name}}
	</div>
</li>

data(){
	return{
		show: false,
		iconColor: false,
		keyIndex: '',
		list: [{date: 'xxx', value: [{name: 'xxx',},{name: 'xxx',}]},{},{}]
	}
},
methods:{
	change(index){
		this.show = !this.show
		this.keyIndex = index
	}
}