解决vxe-table复选框翻页选中问题
根据vxe-table官方文档，想要保留勾选中的数据，我们的代码中需要设置“row-id”和:checkbox-config中的“reserve”属性。
vxe-table官方文档
简单写下html部分：
<vxe-gridrow-id="id":checkbox-config="{ labelField: '', highlight: true, trigger: 'row', reserve: true , range: true}"@checkbox-all="selectAllEvent"@checkbox-change="selectChangeEvent"><!--自定义表格内容--></vxe-grid>
因为项目都用到vxe-table，所有这里使用vue的混入应用的项目的所有页面表格中，在混入文件中写复选框的事件：
//定义数据，简单模拟data() {return {/*table选中keys*/selectedRowKeys: [],/*table选中records*/selectionRows : [],}}//复选框事件(保留翻页选中的数据)selectChangeEvent({checked, records, reserves, row }) {// console.log(checked ? '勾选事件' : '取消事件')// console.log('当前选中的数据：' + records)// console.log('翻页时其他页的数据：' + reserves)// console.log('当前选中的数据行：' + row )//勾选选中时if (checked) {//第一次选数据，还未进行翻页时if (reserves.length == 0){this.selectedRowKeys = records.map(v => v.id);this.selectionRows = records;}else {//id集合，翻页存在已选中的数据时,拼接新选中的数据this.selectedRowKeys = [...reserves.map(v => v.id),...records.map(v => v.id)];//数据集合，翻页存在已选中的数据时,拼接新选中的数据this.selectionRows = [...reserves,...records];}}else {//取消选中时let idIndex = this.selectedRowKeys.indexOf(row.id);if (idIndex > -1) {//删除取消选中删除指定元素idthis.$delete(this.selectedRowKeys, idIndex);}let dataIndex = null;for(let i = 0; i < this.selectionRows.length; i++) {if (this.selectionRows[i].id == row.id) {dataIndex = i;break;}}//删除取消选中的元素整个对象this.$delete(this.selectionRows, dataIndex);}},//vxe复选框当前页全选中方法(保留翻页选中的数据)：selectAllEvent({checked, records, reserves}) {// console.log(checked ? '勾选事件' : '取消事件')// console.log('当前选中的数据：' + records)// console.log('翻页时其他页的数据：' + reserves)//全选中时if (checked) {//第一次选数据，还未进行翻页时if (reserves.length == 0){this.selectedRowKeys = records.map(v => v.id);this.selectionRows = records;}else {//id集合，翻页存在已选中的数据时,拼接新选中的数据this.selectedRowKeys = [...reserves.map(v => v.id),...records.map(v => v.id)];//数据集合，翻页存在已选中的数据时,拼接新选中的数据this.selectionRows = [...reserves,...records];}}else {//取消全选时,直接将翻页数据赋值，当前页数据不用加上this.selectionRows = reserves;this.selectedRowKeys = reserves.map(v => v.id)}}
上面就实现了vxe-table表格复选框选中和全选中事件，在进行翻页选其他页的数据时，还能保留前面选中的数据的功能，有什么问题的话可以在评论区留言。
