vue2 el-table实现跨页多选功能

1、首先要在el-table上绑定勾选框和全选框的事件

<el-table :data="tableData" class="table_box" ref="multipleTables" style="width: 100%" height="50vh" @select="addAnalysisChange" @select-all="selectAll">
	<el-table-column type="selection" width="55"></el-table-column>
	<el-table-column prop="name" label="名称" show-overflow-tooltip>
	</el-table-column>
	<el-table-column prop="orgcode" label="机构代码" show-overflow-tooltip>
	</el-table-column>
	...
</el-table>

2、在data里声明一个数组 用来存放勾选的项 allSelected

3、开始编写js啦

// 单独勾选
addAnalysisChange(selection,row) {
    if (!this.allSelected.includes(row.id)) {
        this.allSelected.push(row.id);
    } else {
        // 取消勾选就删掉
        this.allSelected.forEach((id, index) => {
		    if (id === row.id) {
		        this.allSelected.splice(index, 1);
		    }
	    });
    }
},
selectAll(selecteds) {
    if (selecteds.length > 0) {
        // 如果全选 push进去
	    selecteds.forEach(item => {
	    if (!this.allSelected.includes(item.id)) {
	        this.allSelected.push(item.id);
	    }
    });
} else {
    // 如果取消全选 就将此页表格的id 过滤掉
    const currentPageIds = this.tableData.map(item => item.id);
    this.allSelected= this.allSelected.filter(id =>!currentPageIds.includes(id));
    }
},