1. html代碼
@row-click="rowClick"css
:row-class-name="tableRowClassName"html
:row-style="selectedHighlight"this
2. js代碼htm
// 解決當表格有固定列,點擊,鼠標懸浮的時候行會變色的問題索引
tableRowClassName({ row, rowIndex }) {get
//把每一行的索引放進rowtable
row.index = rowIndex;class
},import
// 解決當表格有固定列,點擊,鼠標懸浮的時候行會變色的問題cli
selectedHighlight({ row, rowIndex }) {
if (this.getIndex === rowIndex) {
return {
'background-color': '#ffeecf !important'
};
}
if(rowIndex % 2 == 0){
return {
'background-color': '#F9F9F9'
}
}
},
// 解決當表格有固定列,點擊,鼠標懸浮的時候行會變色的問題
rowClick(row) {
this.getIndex = row.index;
},
3. css代碼
/ 當table有fixed固定列的時候,鼠標懸浮同樣會變色 /
.el-table__body .el-table__row.hover-row td {
background-color: #FFF9EE !important;
}