如何更改 Vuetify Datatable 中选定行的背景颜色？

【问题标题】：How to change background color of selected row in Vuetify Datatable?如何更改 Vuetify Datatable 中选定行的背景颜色？
【发布时间】：2020-01-13 07:56:03
【问题描述】：

在我的 Vuetify 数据表中，我想更改单击行的背景颜色。在docs 中，我看到一个名为click:row 的事件发出，但它只返回该行的数据。如何检测行字段并更改其css？

【问题讨论】：

标签： vue.js vuejs2 vuetify.js

【解决方案1】：

将点击行的索引存储在数据属性中：

data () {
    return {
      selectedRow: null
    }
}

然后有条件地应用样式。您需要使用插槽来执行此操作，请参阅下面的代码笔：

 <tr :class="key === selectedRow ? 'custom-highlight-row' : ''">

https://codepen.io/huntleth/pen/eYOrWog

【讨论】：