一种在 riosJS 中基于 1 次验证在 DOM 元素上添加多个类的方法

Question

假设我想根据我得到的布尔变量在我选择的 DOM 元素上添加 2 classes。使用 1 class 会非常简单，只需执行以下操作：

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

但是 2+ classes 呢？

我尝试过：

<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 classes，这将有效：

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

如果 class1 和 class2 只是包含 CSS class 名称的变量，我会使用这样的东西：

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

一种在 riosJS 中基于 1 次验证在 DOM 元素上添加多个类的方法

A way to add multiple classes on DOM element based on 1 validation in riosJS

html

riot.js

一种在 riosJS 中基于 1 次验证在 DOM 元素上添加多个 类 的方法

A way to add multiple classes on DOM element based on 1 validation in riosJS

html

riot.js

一种在 riosJS 中基于 1 次验证在 DOM 元素上添加多个类的方法