Element ui 表格 在前端分页之后，多选框失效的问题？

Question

部分代码

     <el-table
                :data="tableData.slice((query.pageIndex-1)*query.pageSize,query.pageIndex*query.pageSize)"
                border
                class="table"
                ref="multipleTable"
                header-cell-class-name="table-header"
                @selection-change="handleSelectionChange"
            > 
<el-table-column type="selection" width="55" align="center"></el-table-column>

          handleSelectionChange(sels) {
            this.multiSels = sels;
            console.log("selection");
            console.log(sels);
        },

整个的界面是这样的

我在前端对数据分了页，然后想实现批量删除，出现了下面的问题，点击了前面的checkbox并没有反应
（下面的log是在点击了一下第一行之后出现的）

尝试之后

如果去掉了@selection-change 就可以选择，但是这样我就无法实现批量删除的功能。

有什么办法能够解决这一问题吗

Answer 1

已找到解决方案

https://blog.csdn.net/weixin_45289656/article/details/121605731?spm=1005.2026.3001.5635&utm_medium=distribute.pc_relevant_ask_down.none-task-blog-2~default~OPENSEARCH~Rate-20-121605731-ask-7720891.pc_feed_download_top3ask&depth_1-utm_source=distribute.pc_relevant_ask_down.none-task-blog-2~default~OPENSEARCH~Rate-20-121605731-ask-7720891.pc_feed_download_top3ask