To achieve the effect, when the item is 0, the font color displays blue, otherwise it displays orange
1.v-if-v-else/v-show method, only one of them is displayed
#v-if v-else
<div class="blue" v-if="item.num == '0'">{
{
item.num }}</div>
<div class="orange" v-else>{
{
item.num }}</div>
#v-show
<div class="blue" v-show="item.num == '0'">{
{
item.num }}</div>
<div class="orange" v-show="item.num !== '0'">{
{
item.num }}</div>
2. Conditional judgment class
Judgment class
<div :class="item.num == '0' ? 'blue' : 'orange'">{
{
item.num }}</div>
.blue {
color: #11b4ff;
}
.orange {
color: #ff9d4a;
}
judgment style
<div class="blue" :style="item.num == '0' ? 'color:#11b4ff;' : 'color:#ff9d4a;'">{
{
item.num }}</div>