elementui table表格点击当前行显示背景色

 

 

 

 

 

 

 

 

<el-table
      ref="rzTable"
      class="rz-table-content"
      :data="tableData.data"
      style="width: 100%; text-align: left"
      :header-cell-style="headerStyle"
      @selection-change="handleSelectionChange"
      @row-click="rowClick"
      :row-class-name="tableRowClassName"
      :row-style="selectedHighlight"
    >

methods: {
    //当某一行被点击时会触发该事件
    rowClick(row) {
      this.getIndex = row.index;
      this.$emit("rowClick", row);
    },
    tableRowClassName({ row, rowIndex }) {
      //把每一行的索引放进row
      row.index = rowIndex;
    },
    selectedHighlight({ row, rowIndex }) {
      if (this.getIndex === rowIndex) {
        return {
          "background-color": "#CAE1FF",
        };
      }
    },

.rz-table >>> .el-table__row:hover > td {
  background-color: transparent;
}