Bind multiple classes with one condition in Vue [duplicate]

Question

For example, I had expected something like this to work in that way with using a single condition and setting an array of classes at once:

<div v-bind:class="{['bg-red-500','bg-white']:isActive}">
...
</div>

How can I bind multiple classes with a single condition in Vue without using an extra function?

Answer 1

This should work:

<div :class="[isActive ? ['bg-red-500','bg-white'] : '']">
 ...
</div>