Vue 按条件添加类


Vue 按条件添加类

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<el-card class="box-card">
<div class="question" ref="question" v-for="(question, index) in questionList" :key="question.id">
<h4>{{(index+1) +10*(currentPage-1)}}. {{question.ques}}</h4>
<div v-for="option in question.options" :key="option.id" :class="[
{'choose': true},
{'wrong': option.value[0] === question.useranswer},
{'right': option.value[0] === question.answer}
]">
<label>
<span>{{option.value}}</span>
</label>
</div>
</div>
<el-pagination background layout="prev, pager, next, jumper" :total="total" :page-size="pageLimit" :hide-on-single-page="noPagination" @current-change="currentChange">
</el-pagination>
</el-card>

项目中直接抽出来的(人菜勿喷)

关键

1
2
3
<div :class="[{ red: true }, { blue: false }]">红色</div>

<div :class="[{ red: false }, { blue: true }]">蓝色</div>

css

1
2
3
4
5
6
7
.red {
color: red;
}

.blue {
color: blue;
}

image-20220213191710083


文章作者: 赤蓝紫
版权声明: 本博客所有文章除特別声明外,均采用 CC BY 4.0 许可协议。转载请注明来源 赤蓝紫 !
评论
  目录