Способ добавления нескольких классов в элемент DOM на основе 1 проверки в riosJS

Question

Допустим, я хочу добавить 2 класса в элемент DOM по своему выбору, основываясь на булевой переменной, которую я получил. С 1 классом это было бы действительно просто, просто выполнив:

<span class="{ class1 : variable }">Text</span>

А как насчет 2+ классов?

Я пытался:

<span class="{ class1, class2 : variable }">Text</span>

<span class="{ ['class1', 'class2'] : variable }">Text</span>

<span class="{ class1 &amp;&amp; class2 : variable }">Text</span>

Есть ли реальный путь или сейчас невозможно?

Я просто хочу избежать этого:

<span class="{ class1: variable } { class2: variable }">Text</span>

Спасибо.

Answer 1

Это возможно, да.

Если class1 и class2 являются фактическими классами CSS, это будет работать:

<div class={"class1 class2": flag}>text</div>

Если class1 и class2просто переменные, содержащие имена классов CSS, я бы использовал что-то вроде этого:

<div class={flag ? `${this.class1} ${this.class2}` : ''}>text</div>