[Vuejs]-Is it possible to set multiple classes with ternary expressions?

0👍

You just need to update it to

<p :class="[!popBox ? 'opacity-100' : 'opacity-60', !popDeleteBox ? 'opacity-100' : 'opacity-60']"></p>

You could use class bindings, with v-bind:class

<p v-bind:class="{ 'opacity-60': popBox || popDeleteBox, 'opacity-100': !popBox && !popDeleteBox, }"></p>

Or, just as a string

<p :class="`${!popBox ? 'opacity-100' : 'opacity-60'} ${!popDeleteBox ? 'opacity-100' : 'opacity-60'}`"></p>

Leave a comment