[Vuejs]-Unescape returned value from filters

by

0👍

✅

You’ll have to use v-html and call the filter through $options

<td v-html="$options.filters.checkStatus(props.item.published)"></td>

But I would really suggest using a computed property or inline ternary expression on the bound class instead e.g.

With inline ternary:

<td>
    <span :class="[props.item.published > 0 ? 'bg-orange-400' : 'bg-teal-300']" class="text-highlight">
        <i :class="[props.item.published > 0 ? 'icon-check' : 'icon-cross3']"></i>
    </span>
</td>

With computed properties:

<td>
    <span :class="spanClass" class="text-highlight">
        <i :class="iconClass"></i>
    </span>
</td>


computed: {
    spanClass() {
        return this.props.item.published > 0 ? 'bg-orange-400' : 'bg-teal-300';
    },
    iconClass() {
        return this.props.item.published > 0 ? 'icon-check' : 'icon-cross3';
    },
}

Leave a comment