Antd tableau cliquez sur la ligne pour changer de couleur, le déplacement de la souris ne change pas de couleur pour atteindre

La table antd a son propre style d'entrée de la souris, de sorte que la ligne aura un style après son entrée. La méthode suivante peut obtenir l'effet de couleur souhaité après que la souris a cliqué sur la ligne

<template>
  <div style="display: flex">
      <a-table
          :columns="leftColumns"
          :dataSource="leftTableData"
          :pagination="false"
          style="margin-top: 10px"
          :rowKey="
          (record, index) => {
    
    
            return index;
          }
        "
          :customRow="rowClick"
          :scroll="{
    
    
          y: leftTableHeight,
        }"
      >
      </a-table>
  </div>
</template>
<script>

import moment from 'moment'
export default {
    
    
  components: {
    
    },
  data() {
    
    
    return {
    
    
      extraParams: {
    
    
        startDate:moment().format('YYYY-MM-DD'),
        endDate:moment().format('YYYY-MM-DD'),
        inpatientNo:'',
        userNo:undefined,
        type:undefined,
        unStart:false,
        unFinish:false,
        unEnd: false,
      },
      leftTableData: [{
    
    
        patientNo:1,
        bedNo:1,
        name:'张三',
        sex:'男'
      },{
    
    
        patientNo:2,
        bedNo:2,
        name:'张三',
        sex:'男'
      },{
    
    
        patientNo:3,
        bedNo:3,
        name:'张三',
        sex:'男'
      },{
    
    
        patientNo:4,
        bedNo:4,
        name:'张三1',
        sex:'男'
      },{
    
    
        patientNo:5,
        bedNo:5,
        name:'张三2',
        sex:'男'
      },{
    
    
        patientNo:6,
        bedNo:6,
        name:'张三3',
        sex:'男'
      },{
    
    
        patientNo:7,
        bedNo:7,
        name:'张三4',
        sex:'男'
      }],
      leftColumns: [
        {
    
    
          title: "床号",
          dataIndex: "bedNo",
          align: "center",
        },
        {
    
    
          title: "姓名",
          dataIndex: "name",
          align: "center",
          scopedSlots: {
    
    
            customRender: "name",
          },
        },
        {
    
    
          title: "性别",
          dataIndex: "sex",
          align: "center"
        }
      ],
      leftTableHeight: ' calc(100vh - 144px - 40px - 40px ) ',
    };
  },
  created() {
    
     },
  methods: {
    
    
    moment,
    rowClick: function (record) {
    
    
      if(this.extraParams.inpatientNo === String(Number(record.patientNo))){
    
    
        return {
    
    
          style: {
    
    
            color:'black',
            background: '#87CEFA',
          },
        };
      }
      return {
    
    
        on: {
    
    
          click: (e) => {
    
    
            this.cellLeft(record);
            console.log(e)

          },
        },
      };
    },
    cellLeft(item) {
    
    
      this.extraParams.inpatientNo = String(Number(item.patientNo));
      this.tableData = [];
    },

  },
};
</script>
<style lang="less" scoped>
/deep/ .ant-table-tbody > tr:hover:not(.ant-table-expanded-row) > td {
    
    
  background: none !important;
}
/deep/ .ant-table-body .ant-table-row-hover{
    
    
  background: none !important;
}
/deep/ .ant-table-body .ant-table-row-hover>td{
    
    
  background: none !important;
}
</style>