<template>
<el-table ref="myTable" :data="tableData" highlight-current-row @current-change="handleCurrentChange">
  <el-table-column prop="date" label="Date"></el-table-column>
  <el-table-column prop="name" label="Name"></el-table-column>
  <el-table-column prop="address" label="Address"></el-table-column>
</el-table>
<div>
  <el-button @click="selectRow(tableData[1])">选中第二行</el-button>
  <el-button @click="selectRow()">清除选中行</el-button>
</div>
</template>

<script>
export default {
  name: "Table_Demo10",
  data() {
    return {
      tableData: [
        {
          date: "2016-05-03",
          name: "Tom",
          address: "No. 189, Grove St, Los Angeles"
        },
        {
          date: "2016-05-04",
          name: "Tom1",
          address: "No. 1891, Grove St, Los Angeles"
        },
        {
          date: "2016-05-05",
          name: "Tom2",
          address: "No. 1892, Grove St, Los Angeles"
        },
        {
          date: "2016-05-06",
          name: "Tom3",
          address: "No. 1893, Grove St, Los Angeles"
        },
      ]
    }
  },
  methods: {
    handleCurrentChange(currentRow, oldCurrentRow) {
      console.log(currentRow)
      console.log(oldCurrentRow)
    },
    selectRow(row) {
      this.$refs.myTable.setCurrentRow(row);
    }
  }
}
</script>

<style scoped>

</style>
