[Vuejs]-How to render conditional html

You may looking for v-if

<span v-if=“status==‘pending’” >….

https://v2.vuejs.org/v2/guide/conditional.html

You can use v-if directive:

<span class='pending' v-if="status === 'pending'">
    pending
</span>
<span class='complete' v-else>
    complete
</span>

See more details: https://v2.vuejs.org/v2/guide/conditional.html

If you have a bunch of different statuses, then you can have something like this in the template:

<span v-if="status" :class="status">{{ status }}</span>

The span will be displayed when status is truthy and the class and inner text will be set to the status value.