vue中css样式高阶用法(一):style和:class使用方法getStatus_无围之解的博客-CSDN博客
<div v-for='item in data' :key='item.index'>
<div
class="item"
:class="{
'status-on': item.a=== 1,
'status-end': item.a === 2,
}">
{{
item.a=== 0? '即将开始': item.a=== 1? '进行中': '已结束'}}
</div>
</div>
css:部分
<style>
.status-on {
background: #78d04c;
}
.status-end {
background: #4c5399;
}
<style/>