vue 模板里的 class 里如何使用变量?

作者站长头像
站长
· 阅读数 3

有段代码如下:

<td class="bBallTd" v-for="index of data.blue_num"><span :class="[item.blue_list.indexOf(index) === -1 ? 'fB' : 'blue fW', 'circle bball']">{{index}}</span></td>

上面代码里的 span 标签的 class 样式,我希望再加一个 red{{index}} 的样式,我直接这样写,直接展示的 class 值为 blue fW circle bball blue{{index}} ,这个 index 是个数字值,值类似为 1,2,3,4,5,6 ...... 这种的。

请问一下大佬这里该怎么处理呢?谢谢。

回复
1个回答
avatar
test
2024-06-25

你就当成JS来书写就好了。比如说

<div
  v-for="index of data.blue_num"
  :class="['blue', 'blue' + index, 'fw', 'circle']"
>{{ index }}</div>
回复
likes
适合作为回答的
  • 经过验证的有效解决办法
  • 自己的经验指引,对解决问题有帮助
  • 遵循 Markdown 语法排版,代码语义正确
不该作为回答的
  • 询问内容细节或回复楼层
  • 与题目无关的内容
  • “赞”“顶”“同问”“看手册”“解决了没”等毫无意义的内容