el-tbale实现翻页多选保留其他页的选项

复制代码
  multipleSelections: [],//当前页选择项
  selectItem: [],//返回数据对比当前页数据的结果
  multipleList: []//实际选择项

  //
确认按钮,返回最后的结果 getMulRows() { const list = [] this.multipleList.forEach(item => { if (item.rows) { list.push(...item.rows) } }) this.closeClick(list) }, closeClick(row) { this.$emit('closeHandler', row) },
  // selection-change当选择项发生变化时会触发该事件 handleSelectionChange(row) {
this.multipleSelections = row },
  // select当用户手动勾选数据行的 Checkbox 时触发的事件
  //select-all当用户手动勾选全选 Checkbox 时触发的事件
  handleRowSelect(row) { let index, object
this.multipleList.forEach((item, i) => { if (item.page === this.dialogPageInfo.page) { index = i object = item return } }) if (object) { object.rows = [...row] this.multipleList[index].rows = [...new Set(object.rows)] } else { const params = { 'page': this.dialogPageInfo.page, 'rows': [...row] } this.multipleList.push(params) this.multipleList = [...new Set(this.multipleList)] } },
  // 翻页更新数据时调用 setCheckedRows() {
this.selectItem = [] if (this.tableData.length === 0 || this.multipleList.length === 0) return const index = this.multipleList.find(item => { return item.page === this.dialogPageInfo.page }) if (!index) return this.tableData.forEach(item => { index.rows.forEach(mItem => { if (item.pkId === mItem.pkId) { this.selectItem.push(item) } }) }) if (this.selectItem.length > 0) { this.$nextTick(() => { this.selectItem.forEach(item => { this.$refs.table.toggleRowSelection(item) }) }) } }
复制代码

 

posted @   Stitchhhhh  阅读(228)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
· 【硬核科普】Trae如何「偷看」你的代码?零基础破解AI编程运行原理
· 单元测试从入门到精通
· winform 绘制太阳,地球,月球 运作规律
· 上周热点回顾(3.3-3.9)
点击右上角即可分享
微信分享提示