# ant-vue table组件selectedRows翻页后不保留上一页已选的解决方案
实现selectedRowKeys, selectedRows翻页后数据同步
vue方法
rowSelectionOption (selectedRowKeys, selectedRows) {
this.selectedRowKeys = selectedRowKeys
if (this.selectedData.length > 0) {
this.selectedData = MergeArray(this.selectedData, selectedRows, this.selectedRowKeys)
} else {
this.selectedData = selectedRows
}
}
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
相关函数
// ant-vue table组件selectedRows翻页后不保留上一页已选的解决方案
// 解决selectedRowKeys, selectedRows同步选中并且保存
/**
* 数据去重
* @param {*} arr1 翻页后需要保存的数据
* @param {*} arr2 当前页选中的数据
* @param {*} arr3 当前页及翻页选中的key值
* @param {*} key 当前表格唯一值,可替换为你的唯一值 (比如id)
*/
export const MergeArray = (arr1, arr2, arr3, key='productNo') => {
var _arr = []
for (var i = 0; i < arr1.length; i++) {
_arr.push(arr1[i])
}
for (var x = 0; x < arr2.length; x++) {
var flag = true
for (var j = 0; j < arr1.length; j++) {
if (arr2[x][key] === arr1[j][key]) {
flag = false
break
}
}
if (flag) {
_arr.push(arr2[x])
}
}
_arr = spliceArray(_arr, arr3 ,key)
return _arr
}
/**
* 删除未选择的数据
*/
const spliceArray = (arr1, arr2, key) => {
var _arr = []
for (var x = 0; x < arr1.length; x++) {
for (var j = 0; j < arr2.length; j++) {
if (arr1[x][key] === arr2[j]) {
_arr.push(arr1[x])
}
}
}
return _arr
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
← 下载图片或者文件