element ui 表格 点击操作列按钮整行高亮

在Element UI中，如果你想实现点击操作列按钮时整行高亮的功能，可以结合`highlight-current-row`属性以及自定义事件来实现。首先，确保设置了表格的`row-class-name`属性，这样可以根据行的状态动态改变样式。然后，在操作列的按钮上绑定了一个事件，当按钮被点击时，可以通过`this.$refs.table.setCurrentRow(row)`来设置当前选中的行。

以下是一个简单的示例[^2]：

<template>
  <el-table :data="tableData" ref="table">
    <!-- 添加row-class-name以支持行级样式 -->
    <el-table-column type="selection" label="选择"></el-table-column>
    <el-table-column prop="name" label="姓名"></el-table-column>
    <el-table-column prop="operation" label="操作">
      <template slot-scope="scope">
        <el-button @click="handleRowClick(scope.row)">操作</el-button>
      </template>
    </el-table-column>
  </el-table>
</template>

<script>
export default {
  methods: {
    handleRowClick(row) {
      this.$refs.table.setCurrentRow(row); // 设置高亮
    }
  },
  data() {
    return {
      tableData: [
        // ...
      ]
    };
  }
};
</script>

在这个例子中，当你点击操作列的按钮时，对应的行会被设置为当前选中状态，即高亮显示。