String
<v-data-table
:headers="headers"
:items="lines"
item-class="color"
...
</v-data-table>
data: () => ({
lineas: [
{text: 'Uai', color: 'red-line'},
{text: 'HH', color: 'red-line'},
{text: 'Liujiaji', color: 'blue-line'},
],
})
<style>
.blue-line td {
color: green;
}
.red-line td{
color: red;
}
</style>
Function
<v-data-table
:headers="headers"
:items="items"
:item-class="rowClass"
></v-data-table>
rowClass(item) {
console.log(item)
const rowClass = 'liujiaji-tr-class'
return rowClass;
}
<style lang="css">
.liujiaji-tr-class {
background-color: green;
}
</style>
hover颜色
.liujiaji-tr-class:hover {
background-color: green !important;
}
以上酌情加 ::v-deep
