How to use ternary expressions to judge multiple states?

When I was working on a project, I encountered one parameter and four states. Later, I checked the various usage methods of ternary
as follows:

<view class="check-info">账单状态: <span class="check-item" :class="{greenFont:item.status==0, blueFont:item.status==1, yellowFont:item.status==2, redFont:item.status==9}">{
    
    {
    
    item.status==0?"待确认" : (item.status==1 ? "待支付" :(item.status==2 ? '已支付' : '过期'))}}</span></view>

The text color is different in different states.
redFont{ color: #737373; } .greenFont{ color: #DD524D; } .blueFont{ color: #F0AD4E; } .yellowFont{ color : #18B566 ; Thanks! ! !











Guess you like

Origin blog.csdn.net/weixin_44237840/article/details/113260999