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

部分代码
     <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);
        },

整个的界面是这样的

img

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

img

尝试之后

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

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

已找到解决方案

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