element 修改表格样式

修改elemet el-table 奇偶行的表格样式

<el-table :row-class-name="tableClass" :data="msgList" style="width: 100%" table-layout="auto" class="tableAuto">

在el-table中加一个自定义的class名:row-class-name="tableClass"

在方法中使用自定义的名字进行奇偶行的class赋值

// 改变表格颜色
        tableClass({ row, rowIndex }) {
            if (rowIndex % 2 == 1) {
                //奇数行，序号不能被2整除
                return "even-rows"; //奇数行class名
            } else {
                return "even-row";//偶数行class名
            }
        }

接着在css中对定义的class进行样式修改即可

.el-table >>>.even-rows {
    background-color: rgba(1, 66, 124, 0.8) !important;;
}
.el-table >>>.even-row {
    background-color: #023366 !important;;
}