1.elementui 官方文档中  el-table 属性 row-style (行的style的回调方法)

2.项目中具体使用

        点击记录按钮传给后端当前行id；点击查找记录按钮获取id并将id对应行高亮显示。

        html部分

<el-button
        type="primary"
        size="mini"
        style="margin: 10px 10px 10px 0"
        @click="record"
        >记录位置</el-button
      >
<el-button
   type="primary"
   size="mini"
   style="margin: 10px 0"
   @click="Lookup(lookuplist)"
 >
    查找位置
</el-button>
<el-table
        :data="tableData"
        style="width: 100%"
        :header-cell-style="{ background: '#F2F6FC', color: '#606266' }"//表格头部样式
        ref="multipleTable"
        size="mini"
        border
        :row-style="tableRowStyle"
        @selection-change="handleSelectionChange"
      >
        <el-table-column type="selection" width="55"></el-table-column>
        <el-table-column label="操作" width="100">
          <template slot-scope="scope">
            <el-button @click="handleClick(scope.row)" type="text" size="small">
                修改</el-button>
            <!-- 修改组件 -->
            <Editnews
              :editDialog="editDialog"
              :row="row"
              @editCacels="editCacels"
              :show-close="false"
            ></Editnews>
          </template>
        </el-table-column>
        <el-table-column
          prop="title"
          label="标题"
          :show-overflow-tooltip="true"
        >
          <template slot-scope="scope">
            <a :href="scope.row.linkurl" target="_blank">{{
              scope.row.title
            }}</a>
          </template>
        </el-table-column>
        <el-table-column prop="publishtime" label="发布时间"> </el-table-column>
        <el-table-column prop="data_source" label="来源"> </el-table-column>
      </el-table>

 js部分

import { newsList,lookup,record } from "../../api/News/news";//引入接口
export default {
 data() {
    return {
      tableData: [], //表格数据
      lookuplist:[],//查找记录数据
      multipleSelection: [], //选中行数据
  },
 created() {
    this.getNews();
    this.findloaction()
  },
  methods: {
    //获取数据
    getNews() {
      newsList(this.formInline).then((res) => {
        this.tableData = res.data;
      });
    },
   //记录位置
    record() {
      this.recordId = this.multipleSelection.toString();
      let params = {
        recording: this.recordId,//传当前行id给后端
      };
      if(this.multipleSelection.length!=1){
        this.$message.error("只能选择一条打标数据记录！")
      }else{
        record(params).then(res => {
          // console.log(res);
          this.$message.success("记录成功")
        })
      }
      this.$refs.multipleTable.clearSelection();
    },
    //查找位置
    findloaction() {
        lookup().then(res=>{
          this.lookuplist = res;
        })
    },
    Lookup(rows){
      this.dialogVisible=true;
      this.findloaction();
      this.Lookupid = rows.id;
    },
    //改变颜色
     tableRowStyle({row}){
        let rowBackground = {};
        if(row.id == this.lookuplist){
          rowBackground.background = "#F49E9E"
          return rowBackground
        }
      },
//选中行的数据
    handleSelectionChange(val) {
      this.multipleSelection = [];
      for (let selectedItem of val) {
        this.multipleSelection.push(selectedItem.id);
      }
    },
}

效果