Question

我的vuejs应用程序中存在一个v-for循环。我希望每个跨度都有不同的类名。例如.spa0，.spa1，.spa3 .....如何在v-for循环中使用索引？

我尝试过这样的事情：

 :class="`spa${index}`"

我的一些代码是：

<div>
<span v-for="(t, index) in table_data" :class="`spa${index}`">{{t}}</span>
</div>

我希望每个跨度都有不同的班级。

Answer 1

如果table_data就像您在评论中所说的那样：

{
  type: 'LDAP',
  des: 'LDAP for Demo - Do not edit or delete this App',
  api: 'show token',
  scim: 'cloud.kapstonellc.com:8082/scim/v2/10VN44ZN',
  endis: true,
  act: true
}

您可能应该改为遍历table_data键：

<div>
  <span v-for="(key, index) in Object.keys(table_data)" :class="`spa${index}`">
    {{ table_data[key] }}
  </span>
</div>

迭代时没有得到不同的类名

1 个答案: