javascript - Vuejs中如何将css应用到劣等类

Question

我有一个 html 文件，可以通过 vuejs 中的按钮工作。
v-bind:class 可以用于一个标签，如下所示。
它消失取决于 bool 数据的 bool 值。

<h3 v-bind:class="{active: bool}">{{counter.document}}</h3>

但我的目标是我要根据优等类(Class)的条件出现和消失劣等类(Class)。
我怎样才能正确地做到这一点？非常感谢您的阅读。

<div v-bind:class="{active: orderOptions.item.document}">
    <button v-on:click="counter.document -= 1">-</button>
    <h3>{{counter.document}}</h3>
    <button v-on:click="counter.document += 1">+</button>
 </div>

Answer 1

在 V-bind:style VueJS 中使用条件:

v-bind:style= "[condition ? {styleA} : {styleB}]"


<div v-bind:style="[orderOptions.item.document ?"active",""]">
    <button v-on:click="counter.document -= 1">-</button>
    <h3>{{counter.document}}</h3>
    <button v-on:click="counter.document += 1">+</button>
 </div>