方案1
<el-table
:data="tableData"
highlight-current-row
ref='singleTable' >
</el-table>
需要注意的是highlight-current-row
必须设置,不然高亮不会生效
setCurrent(row) { // 给操作行 高亮
if (row) {
this.$refs.singleTable.setCurrentRow(row, true);
} else {
this.$refs.singleTable.setCurrentRow();
}
}
补充:table百分比设置列宽
示例如下:
<el-table-column label="序号" min-width="10%">
<template slot-scope="scope">
<span>{{ id }}</span>
</template>
</el-table-column>
如此即可!
方案2
<el-table
:data="tableData" :row-class-name="tableRowClassName">
</el-table>
methods:{
tableRowClassName({ row, rowIndex }) {
if (row.status == 3) {
return "warning-row";
}
return "";
},
}
<style lang='scss'>
.el-table .warning-row {
background: #fff0f0;
}
</style>
如此即可!