el-table实现每行颜色不同

 <el-table
            ref="multipleTable"
            v-loading="loading"
            :data="orderList"
            :row-class-name="tableRowClassName"
          >

row-class-name

行的 className 的回调方法，也可以使用字符串为所有行设置一个固定的 className

 tableRowClassName({ row, rowIndex }) {
      // console.log(row);
      if (row.isRemind == 2) {
        return "warning-row";
      } else if (row.isRemind == 3) {
        return "success-row";
      } else if (row.isRemind == 4) {
        return "red-row";
      } else if (row.isRemind == 5) {
        return "yellow-row";
      } else if (row.isRemind == 1) {
        return "green-row";
      } else if (row.isRemind == 0) {
        return "yellow-row";
      }
      return "";
    },

根据每行的值，添加不同的类名，根据类名，添加不同样式

::v-deep .el-table .warning-row {
  background: rgb(226, 211, 179);
  // color:red;
}
::v-deep .el-table .success-row {
  background: pink;
  // color:green;
}
/* 红 */
::v-deep .el-table .red-row {
  background: #f30d0d4f;
  color: black;
}
/* 绿 */
::v-deep .el-table .green-row {
  background: #9cd87cd8;
  // color:green;
}
/* 黄 */
::v-deep .el-table .yellow-row {
  background: #f7f32b9d;
  color: black;
}

排序

  // 排序 
   sortreceiveTime(column, prop, order) {
      //  console.log(column.order); 
      //  return 
      if (column.order != null) {
        this.queryParams.collation = column.order;
      } else {
        this.queryParams.collation = descending;
      } 
      this.getList();    
      //ascending     升序
      //descending    降序 
      // 
    },