vue + element-ui table组件多页选择数据回显，分页记录保存选中的数据

问题描述：

技术栈vue+element-ui,数据列表就是对element-ui的table组件和Pagination 组件的简单应用，每页10条数据，数据前有选择按钮，可以切换这条数据的选中状态，切换页码时会重新请求接口切换数据，同时也相当于重新渲染列表；
然后问题来了，当你想跨页选择数据时，会发现当前页选中的数据并不会保存下来，选中状态也不会保存下来，也就是说只能保留当前页的数据和状态，这不是一个天坑吗？
思前想后，准备动手搞个数组，实时记录数据id，然后自己匹配数据与状态；正准备动手撸代码时，忽然灵光一闪：这不科学，我这种渣渣都能想到的东西，ele团队那些牛人不可能放过这个坑，于是我又去看了下官方文档，然后，嘿嘿嘿。。。，看图


具体代码如下：

1.在el-table上添加row-key属性，
2.在type为selection的el-table-column上添加reserve-selection属性，值为true;注意只能在selection上使用
3.同时定义getRowKeys

<el-table ref="multipleTable" :data="tableData" 
	@selection-change="selectionChange" :row-key="getRowKeys">
      <el-table-column type="selection" :reserve-selection="true">
      </el-table-column>
</el-table>

	getRowKeys(row) {
   		return row.id;
	},

selectionChange这个事件用来保存选中数据。

总结

用成熟的框架提供的组件，一些常见的坑基本开发人员都已经处理好了，所以我 们要做的其实就是仔细阅读文档，找到相应的解决办法，而不是盲目的自己去撸代码