本文介绍了根据条件添加类的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我想在使用 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.
这篇关于根据条件添加类的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!