elementUI表格单击行时选中该行checkbox

1.table上加上  @row-click="handleClickTableRow"

2.单选框的checkbox那列加上  @selection-change="handleSelectionChange"

3.table加上ref

4.实现1，2的方法

 methods: {
    handleClickTableRow(row, event, column) {
      console.log(row);
      console.log(column);
      this.$refs.fileTable.toggleRowSelection(row);
    },
       handleSelectionChange(rows) {
      console.log(rows);
      this.multipleSelection = rows;
    },
    
  },

结果：

 

 

 

完整代码：

<template>
<div>
  <el-table
  ref="fileTable"
   @row-click="handleClickTableRow"
     :data="tableData"
    style="width: 100%">
    <el-table-column  @selection-change="handleSelectionChange" type="selection" width="55"></el-table-column>
    <el-table-column
      label="日期"
      width="180">
      <template slot-scope="scope">
        <i class="el-icon-time"></i>
        <span style="margin-left: 10px">{{ scope.row.date }}</span>
      </template>
    </el-table-column>
    <el-table-column
      label="姓名"
      width="180">
      <template slot-scope="scope">
        <el-popover trigger="hover" placement="top">
          <p>姓名: {{ scope.row.name }}</p>
          <p>住址: {{ scope.row.address }}</p>
          <div slot="reference" class="name-wrapper">
            <el-tag size="medium">{{ scope.row.name }}</el-tag>
          </div>
        </el-popover>
      </template>
    </el-table-column>
    
  </el-table>
</div>
</template>
<script>
export default {
  name: "HelloWorld",
  data () {
    return {
       multipleSelection: [], // 表格被选中的内容
       tableData: [{
          date: '2016-05-02',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1518 弄'
        }, {
          date: '2016-05-04',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1517 弄'
        }, {
          date: '2016-05-01',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1519 弄'
        }, {
          date: '2016-05-03',
          name: '王小虎',
          address: '上海市普陀区金沙江路 1516 弄'
        }]
    };
  },
  methods: {
    handleClickTableRow(row, event, column) {
      console.log(row);
      console.log(column);
      this.$refs.fileTable.toggleRowSelection(row);
    },
       handleSelectionChange(rows) {
      console.log(rows);
      this.multipleSelection = rows;
    },
    
  },
}
</script>
<style lang="css" scoped>
</style>