vue 翻页选择导出

框架Vue2.15.14，后台是Aps.net core Api

<el-table ref="multipleTable" :data="tableData" tooltip-effect="light" style="width: 100%;text-align: center;"
            height="400" show-harder @selection-change="handleSelectionChange" border :header-cell-style="{ textAlign: 'center' }" :row-key="getRowKey">
            <el-table-column type="selection" width="50" prop="id" :reserve-selection="true" style="text-align:center">
            el-table-column>
        el-table>

重点是el-table：@selection-change="handleSelectionChange"

:row-key="getRowKey"

首列selection 的 :reserve-selection="true" 能够实现界面翻页显示选中

Vue.js

export default {
name: 'DlgGarbageBox',
data() {
        return {
            HandleState: [],
            dataPageIsLoading: false, // 数据分页列表是否加载中
            searchParam: {
                status: "",
                key: "",
                pageIndex: 1,
                pageSize: 10,
                orderColumn: null,
                orderBy: null,
                admin_lettr_ids:""
            },
            dataTotal: 0,
            tableData: [],
            currentrow: "",
            multipleSelection: "",
            selectArr:[],
        }
    },
methods: {
getRowKey(row) {
            return row.id;
        },
/**
         * 获取分页列表 查询
         */
        getPage() {
            this.dataPageIsLoading = true;
            this.$store.dispatch('getAdminLetterPage', this.searchParam).then((res) => {
                this.tableData = res.list;
                this.dataTotal = res.total;
 
                this.dataPageIsLoading = false;
            });
        },
handleSelectionChange(rows) {
            this.multipleSelection = rows;//每次选择的数据
            if (rows.length == 0) this.selectArr = [];
            else {
                //每次选择的数据存起来
                rows.forEach(row => {
                    if (row) {
                        if (this.selectArr.indexOf(row.id) == -1)
                            this.selectArr.push(row.id);
                    }
                });
            }
            console.log(this.selectArr);
        },
//导出
        exportAdminLetter(){
            console.log(this.selectArr);
            this.searchParam.admin_lettr_ids=this.selectArr.join(',');
            let request = {
                ...this.searchParam
            }
 
            this.isRequesting = true;
 
            this.$store.dispatch('exportAdminLetter', request).then(
                res => {
                    this.isRequesting = false;
                    this.searchParam.admin_lettr_ids="";
                    this.selectArr=[];
                    this.$refs.multipleTable.clearSelection();
                },
                err => {
                    this.isRequesting = false;
                }
            );
        },
    }
}

效果图：

不管怎么翻选择的依然都选中，点击导出 参数是选中的三条数据：

这样就实现了翻页选中导出