vue3中使用element plus时，table点击一行时选中

在Vue3中使用Element Plus库创建表格并实现行内点击选中功能，可以借助Element Plus提供的`el-table`组件以及自定义事件处理。首先，你需要在HTML模板上设置基本的表格结构，并给每一行添加一个`@click`事件处理器：

<template>
  <el-table :data="tableData" @row-click="handleRowClick">
    <!-- ...其他列... -->
    <el-table-column type="selection" width="50"></el-table-column> <!-- 添加选择列 -->
    <el-table-column label="操作" width="100">
      <template slot-scope="scope">
        <el-button @click="toggleSelection(scope.$index)" size="small">选择</el-button>
      </template>
    </el-table-column>
  </el-table>
</template>

<script>
export default {
  data() {
    return {
      tableData: [], // 数据数组
      selectedRows: [] // 选中的行索引数组
    };
  },
  methods: {
    handleRowClick(index) {
      this.toggleSelection(index); // 当点击一行时，调用toggleSelection方法
    },
    toggleSelection(index) {
      if (this.selectedRows.includes(index)) {
        this.selectedRows.splice(this.selectedRows.indexOf(index), 1);
      } else {
        this.selectedRows.push(index);
      }
      // 可以在这里做进一步的操作，比如更新状态或者触发其他事件
    }
  }
};
</script>

在这个例子中，`@row-click`事件会触发`handleRowClick`方法，该方法会调用`toggleSelection`方法来切换行的选择状态。`selectedRows`数组用于存储当前选中的行索引。