我可以使用 vue.js 来更改 css class 吗？

Question

我有一个 MVC 项目，我正在使用 Vue 作为我的申请表。

<div class="validation-error" ref="message">@Html.ValidationMessageFor(m => m.Title)</div>
<div class="label-container">@Html.LabelFor(m => m.Title)</div>   
<div class="form-control">@Html.TextBoxFor(m => m.Title, new { v_model = "val", @ref = "field" })</div>

这是一个带有验证消息的文本框。我想知道是否可以仅在验证消息处于活动状态时更改文本框的颜色。

我看到 html 呈现一个名为 aria-invalid="true" 的属性，所以我想知道我是否可以使用 v-if 或其他东西。

谢谢

Answer 1

是的，请参阅 Vue.js 文档的 Class and Style Bindings 部分。

下面是一个 class 的示例，它根据 Vue.js 变量的真实性启用或禁用：

<div :class="{ 'css-class-name': isActive }"></div>

我可以使用 vue.js 来更改 css class 吗？

Can I use vue.js to change a css class?

vue.js