在 Vue 2 中混合动态和条件类名

Question

假设我想要一个带有 class a0to 的div，a9根据 v-for 中的索引和b有条件的 class 。

单独做的话，它看起来像这样：

<div v-for="(val, index) in array" :class="'a' + index"></div>

和

<div v-for="(val, index) in array" :class="{'b': index===1}"></div>

当我们将它们混合在一起时，考虑到这是行不通的：

<div v-for="(val, index) in array" :class="{'a' + index: true, 'b': index===1}"></div>

我能得到的最好的（工作解决方案）是这样的：

<div v-for="(val, index) in array" :class="'a' + index + ' ' + (index===1?'b':'') }"></div>

还有更好的方法吗？谢谢。

Answer 1

<div v-for="(val, index) in array" :class="['a'+index, {b: index === 1}]"></div>

或者

<div v-for="(val, index) in array" :class="['a'+index, index === 1 ? 'b' : '']"></div>

在这里查看演示。