关于elementUI 分页 table 使用 toggleRowSelection

我出现问题的前提

在table表格第一页全选 ,第二页全选 回到第一页

点击按钮 取消 第一页,第二页我不要的勾选

初始实现

this.selectedPeraonal是表格 selection-change方法返回的值

javascript 复制代码
handleSelectionChange(val) {
    this.selectedPeraonal = val || []
},

onlineFeedBack(){
    const selectedPeraonal = this.selectedPeraonal.filter(item => !errId.includes(item['welfare_id']))  
    this.$refs['generalTable'].$refs.generalTable.clearSelection()
    this.$nextTick(() => {
        selectedPeraonal.map(item => {
            this.$refs['generalTable'].$refs.generalTable.toggleRowSelection(item,true)
        })
        this.loadingOnLineFeed = false
    })
}

但是 页面未生效

了解到

toggleRowSelection 传入的item必须是当前table表格中的数据才会生效

所以filter 之后就不算当前table的数据了

换个思路

javascript 复制代码
this.$nextTick(() => {
//  toggleRowSelection中传入记录的数据,并不会生效,要传入当前table表格中的数据才会生效
    for (let i = this.selectedPeraonal.length - 1; i >= 0; i--) {
        const item = this.selectedPeraonal[i]
        if (errId.includes(item['welfare_id'])) {                                      
            this.$refs['generalTable'].$refs.generalTable.toggleRowSelection(item, false)
        }
    }
    this.loadingOnLineFeed = false
})
相关推荐
二十雨辰1 小时前
歌词滚动效果
前端·css
法医1 小时前
和文心快码做朋友,让编程像“说话”一样简单
前端·文心快码
前端小巷子1 小时前
JS 打造「放大镜 + 缩略图」一体组件
前端·javascript·面试
陈随易1 小时前
适合中国宝宝的AI编程神器,文心快码
前端·后端·node.js
知识分享小能手1 小时前
React学习教程,从入门到精通,React AJAX 语法知识点与案例详解(18)
前端·javascript·vue.js·学习·react.js·ajax·vue3
UrbanJazzerati1 小时前
掌握 DOM 的基础属性与方法:从操作元素到构建动态效果
前端·面试
hashiqimiya2 小时前
html实现右上角有个图标,鼠标移动到该位置出现手型,点击会弹出登录窗口。
前端·html
古夕2 小时前
前端文件下载的三种方式:a标签、Blob、ArrayBuffer
前端·javascript·vue.js
纯真时光2 小时前
Vue3中pinia状态管理库的使用(Composition API 风格)
前端
李李记2 小时前
Node.js 打包踩坑?NCC+PKG 从单文件到多平台可执行文件,解决 axios 缺失等 80% 问题
javascript