element-ui 复选框,实现点击表格当前行选中或取消

可以通过监听表格的行点击事件，在事件回调函数中更新当前行的复选框状态来实现。

具体实现步骤如下：

1. 在表格组件上添加 `@row-click` 事件监听器。

<el-table :data="tableData" @row-click="handleRowClick">
  <!-- 表格列定义 -->
</el-table>

2. 在事件回调函数中获取当前行的索引，并更新当前行的复选框状态。

methods: {
  handleRowClick(row) {
    // 获取当前行的索引
    const index = this.tableData.indexOf(row);
    // 更新当前行的复选框状态
    this.$refs.multipleTable.toggleRowSelection(this.tableData[index]);
  }
}

需要注意的是，这里使用了 `$refs` 来获取表格组件的实例，并调用了 `toggleRowSelection` 方法来更新复选框状态。在模板中需要给表格组件添加 `ref` 属性：

<el-table :data="tableData" ref="multipleTable">
  <!-- 表格列定义 -->
</el-table>

完整代码示例：

<template>
  <div>
    <el-table :data="tableData" @row-click="handleRowClick" ref="multipleTable">
      <el-table-column type="selection" width="55"></el-table-column>
      <el-table-column prop="name" label="姓名"></el-table-column>
      <el-table-column prop="age" label="年龄"></el-table-column>
    </el-table>
  </div>
</template>

<script>
export default {
  data() {
    return {
      tableData: [
        { name: '张三', age: 20 },
        { name: '李四', age: 25 },
        { name: '王五', age: 30 }
      ]
    }
  },
  methods: {
    handleRowClick(row) {
      const index = this.tableData.indexOf(row);
      this.$refs.multipleTable.toggleRowSelection(this.tableData[index]);
    }
  }
}
</script>