element 表格分页 记住 刷新之后选中的列表

<template>
    <el-table
      :data="tableData"
      :row-key="getRowKey"
       @selection-change="multipleSelectChange"
      style="width: 100%"
>
      <el-table-column :reserve-selection="true" type="selection"></el-table-column>
      <el-table-column
        prop="date"
        label="日期"
        width="180"
>
      </el-table-column>
      <el-table-column
        prop="name"
        label="姓名"
        width="180"
>
      </el-table-column>
      <el-table-column
        prop="address"
        label="地址"
>
      </el-table-column>
    </el-table>
  </template>

<script>
export default {
  data () {
    return {
      selectionList: [],
      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: {
    getRowKey (val) {
      return val.id
    },
    multipleSelectChange (rows) {
      this.selectionList = rows
    }
  }
}
</script>

 

posted @ 2023-02-16 17:42  玉文  阅读(24)  评论(0编辑  收藏  举报