如何在 vuetify 中交替显示 v-list 行的颜色？

Question

存档结果 v-list-item 行交替其各自背景颜色的最佳方式是什么？

Answer 1

您可以使用具有偶数和奇数的 CSS nth-child 选择器轻松实现此效果。您可能需要覆盖 Vuetify 主题颜色。考虑在父列表中指定 class 以防止 app/component 中的所有列表受到影响。据我从文档中看到的，没有 Vuetify 本机解决方案。

.v-list-item:nth-child(even) {
  background: #CCC
}

.v-list-item:nth-child(odd) {
  background: #FFF
}