根据条件添加类 [英] Add a class on a condition

问题描述

我想在使用 vue js 的条件下添加一个特定的类.

I would like to add a specific class on a condition with vue js.

我的 DataStore 中有 2 个这样的值(TypeScript):

I have 2 values in my DataStore like this (TypeScript):

value1: 0 as number,
value2: 0 as number

使用这个值，在我的模板中，我想添加类:

And with this value, in my template, I would like to add the classes:

blue--text if value1 == value2
or
red--text if value1 != value2

像这样:

<p class="blue--text">{{ value1 }}</p>
or
<p class="red--text">{{ value1 }}</p>

有人知道怎么做吗?

推荐答案

您可以使用带有三元和 :class 指令的简单条件:

you can use a simple condition with a ternary and the :class directive:

<p :class="value1 === value2 ? 'blue--text' : 'red--text'">{{ value1 }}</p>

仅当 value1 等于 value2 时应用蓝色类，否则应用红色类.

Only if value1 is equal to value2 the blue class is applied, if not the red one.

这篇关于根据条件添加类的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！