elementUI的table中特定行标红

一、首先在要显示的<el-table></el-table>加上 :row-class-name="tableRowClassName"

 <el-table
        v-loading="tableObj.isLoading"
        border
        :max-height="tableObj.calcMaxHeight"
        class="zq-table-theme-info"
        style="width: 100%"
        :data="tableObj.tableData"
        :row-class-name="tableRowClassName"
      >
        <!-- <el-table-column type="selection" width="55" /> -->
        <el-table-column label="" type="index" width="54"></el-table-column>
        <el-table-column
          :show-overflow-tooltip="true"
          prop="label1"
          label="受理编号"
          :min-width="150"
        ></el-table-column>
        <el-table-column
          :show-overflow-tooltip="true"
          prop="label2"
          label="债券名称"
          :min-width="130"
        ></el-table-column>
        <el-table-column
          :show-overflow-tooltip="true"
          prop="label3"
          label="债券名称备注"
          :min-width="130"
        ></el-table-column>
        <el-table-column
          :show-overflow-tooltip="true"
          prop="label5"
          label="注册/备案"
          :min-width="100"
        ></el-table-column>
        <el-table-column
          :show-overflow-tooltip="true"
          prop="label6"
          label="注册品种"
          :min-width="100"
        ></el-table-column>
        <el-table-column
          :show-overflow-tooltip="true"
          prop="label7"
          label="备案品种"
          :min-width="100"
        ></el-table-column>
        <el-table-column
          :show-overflow-tooltip="true"
          prop="label4"
          label="本期计划发行金额(亿元)"
          :min-width="200"
        ></el-table-column>
        <el-table-column
          :show-overflow-tooltip="true"
          prop="label8"
          label="牵头主承销商"
          :min-width="200"
        ></el-table-column>
        <el-table-column
          :show-overflow-tooltip="true"
          prop="label9"
          label="联席主承销商"
          :min-width="180"
        ></el-table-column>
        <el-table-column
          :show-overflow-tooltip="true"
          prop="label10"
          label="团成员"
          :min-width="140"
        ></el-table-column>
        <el-table-column
          :show-overflow-tooltip="true"
          prop="label11"
          label="企业名称"
          :min-width="90"
        ></el-table-column>
        <el-table-column
          :show-overflow-tooltip="true"
          prop="label12"
          label="发行人所属类别(注册)"
          :min-width="200"
        ></el-table-column>
        <el-table-column
          :show-overflow-tooltip="true"
          prop="label13"
          label="发行人所属类别(发行)"
          :min-width="200"
        ></el-table-column>
        <el-table-column
          :show-overflow-tooltip="true"
          prop="label14"
          label="注册报告名称"
          :min-width="160"
        ></el-table-column>
        <el-table-column
          :show-overflow-tooltip="true"
          prop="label15"
          label="注册通知书文号"
          :min-width="160"
        ></el-table-column>
        <el-table-column
          :show-overflow-tooltip="true"
          prop="label16"
          label="处理状态"
          :min-width="90"
        ></el-table-column>
        <el-table-column
          :show-overflow-tooltip="true"
          prop="label17"
          label="项目阶段"
          :min-width="90"
        ></el-table-column>
        <el-table-column
          :show-overflow-tooltip="true"
          prop="label18"
          label="申请日期"
          :min-width="120"
        ></el-table-column>
        <el-table-column
          :show-overflow-tooltip="true"
          prop="label19"
          label="牵头主承销商联系人"
          :min-width="170"
        ></el-table-column>
        <el-table-column
          :show-overflow-tooltip="true"
          prop="label20"
          label="联系人电话(手机)"
          :min-width="160"
        ></el-table-column>
        <el-table-column fixed="right" label="操作" :min-width="260">
          <template #default="scope">
            <zqActionButtons :data="scope.row" :no-more-num="3">
              <el-button
                :key="scope.$index + scope.row.id + '0'"
                type="primary"
                link
                size="small"
                @click="handleViewPage(scope.row)"
              >
                查看
              </el-button>
              <el-button
                :key="scope.$index + scope.row.id + '1'"
                type="primary"
                link
                size="small"
                @click="handleClick2(scope.row)"
              >
                联主操作员代码修改
              </el-button>
              <el-button
                :key="scope.$index + scope.row.id + '2'"
                type="primary"
                link
                size="small"
                 @click="handleClick9(scope.row)"
              >
                申请补充上会材料
              </el-button>
              <el-button
                :key="scope.$index + scope.row.id + '3'"
                type="primary"
                link
                size="small"
                @click="handleViewNotes(scope.row)"
              >
                查看备注
              </el-button>
            </zqActionButtons>
          </template>
        </el-table-column>
      </el-table>

二、然后再methods:{}中写入  tableRowClassName(){}方法

//标红table指定行
      tableRowClassName({row, rowIndex}) {
 
     //判断条件（quantityStock ，warningLimit ，quantityStock 列表字段信息）
        if (rowIndex === 1) {
          // 后面的css样式
          return 'warning-row';
 
        } else if (rowIndex === 2) {
           // 后面的css样式
          return 'success-row';
 
        }
  
        return '';
      },

三、最后在加上<style scoped>样式(颜色可以自己调)

<style scoped>
 
  /deep/ .el-table .success-row {
    color: rgb(27, 33, 27) !important;
  }
 
  /deep/ .el-table .warning-row {
    color: #f51f1f !important;
  }
 
</style>