javascript - vue class binding problem

Question

<p class="class-status" v-if="item.is_entered==1" v-bind:class="[{'class-status-play' : (dateTimeDiffLive(item.timeline) || item.live_status==1)},{'class-status-play-no' : item.live_status==2 || item.live_status==0}]">已占座</p>

Two different conditions,

1. When dateTimeDiffLive() is established or item.live_status==1 is set, class-status-play is displayed;

2. When item.live_status !=1, class-status-play-no is displayed

{{# if(item.live_status==2) }}

    class-status-play-no

{{ else }} 

{{# if(item.is_entered==1) }} 

    {{# if(dateTimeDiff1(item.timeline)) }}

        class-status-play

    {{ else }}

        class-status-play-no

    {{/if}}

{{/if }}

{{/if }}    

Answer 1

:class="[item.live_status==2?'class-status-play-no':(item.is_entered==1?(dateTimeDiff1(item.timeline)?'class-status-play':'class-status-play-no'):'')]"

Make this condition a fixed value. Use the ternary operator