<template>
  <div>
<!--    <el-table-->
<!--        ref="singleTable"-->
<!--        :data="tableData"-->
<!--        highlight-current-row-->
<!--        @current-change="handleCurrentChange"-->
<!--        style="width: 100%">-->
<!--      <el-table-column-->
<!--          type="index"-->
<!--          width="50">-->
<!--      </el-table-column>-->
<!--      <el-table-column-->
<!--          property="date"-->
<!--          label="日期"-->
<!--          width="120">-->
<!--      </el-table-column>-->
<!--      <el-table-column-->
<!--          property="name"-->
<!--          label="姓名"-->
<!--          width="120">-->
<!--      </el-table-column>-->
<!--      <el-table-column-->
<!--          property="address"-->
<!--          label="地址">-->
<!--      </el-table-column>-->
<!--    </el-table>-->

    <ed-table ref="edtable" :data="tableData" :column-type="columnType" :columns="tableColumns" :loading.sync="loading" @row-click="handlerRowClick"
              @selection-change="handleSelectionChange" :pagination="pagination"></ed-table>
    <div style="margin-top: 20px">
      <el-button @click="setCurrent(tableData[1])">选中第二行</el-button>
      <el-button @click="setCurrent()">取消选择</el-button>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      loading: false,
      columnType: "radio",
      tableColumns:[
        {
          prop: "date",
          label: "日期"
        },
        {
          prop: "name",
          label: "姓名"
        },
        {
          prop: "address",
          label: "地址"
        }
      ],
      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 弄'
      }],
      currentRow: null,
      pagination: {
        current: 1,
        pageSize: 10,
        total: 0,
        pageSizes: [10, 20, 30]
      }
    }
  },
mounted() {
  // this.setCurrent(this.tableData[1])
},
  methods: {
    setCurrent(row) {
      this.$refs.edtable.setCurrentRow(row);
    },
    handleCurrentChange(val) {
      this.currentRow = val;
    },
    handlerRowClick(){},
    handleSelectionChange(){}
  }
}
</script>
