vue3根据数据取消el-table选中状态获取到最新数据

原始数据:

javascript 复制代码
//el-table点击复选框事件
function getSelected(selection, row){
  //判断是否是已选过数据 ==0为没有选,>0有选过
  if(initial.value>0 ){
    let isCheck = false //是否取消 true=取消 false=不取消
    //循环判断已选的数据是否包含当前点击获取到的数据
    feeCodeData.value.forEach(imgItem => {
      //包含当前数据,表示取消选中的操作,需要从已选数据中删除
      if (imgItem.id === row.id) {
        // 先findIndex拿到index,否则直接否则直接splice(imgItem,1)是会删除失败的!
        feeCodeData.value.splice(feeCodeData.value.findIndex((item) => item.id === row.id), 1)
        isCheck = true
      }
    })
    //已选数据中不包含当前数据,表示选中的操作,需要添加到已选的数据中
    if(!isCheck){
      feeCodeData.value.push(row)
    }
  }
  //没有已选数据,直接将选中的数据添加到数组中
  else{
    feeCodeData.value.push(row)
  }
}

结果显示:

相关推荐
代码调试师8 小时前
【毕设分享】springboot攀枝花生鲜电商平台58990
java·vue.js·spring boot·后端·架构·eclipse·课程设计
web打印社区9 小时前
Vue3 发票静默打印,我这边能跑通的一版
前端·javascript·vue.js·chrome·electron
嘟哩DuliDuli10 小时前
创作 Agent 的任务状态该如何保存
android·java·javascript
lemon_sjdk10 小时前
JavaScript 常用关键字全解析
开发语言·javascript·ecmascript
妖孽白小白10 小时前
el-select的内容续写实现
前端·vue.js·elementui
梨想橙汁11 小时前
Pinia 状态管理实战:定义 Store、修改数据、模块拆分
前端·vue.js
高申航11 小时前
Vue 3 + DYMO Connect Framework 实战:从标签模板到打印服务的完整实现
前端·javascript·vue.js
梨想橙汁11 小时前
Vue3 组件开发:生命周期钩子,组件之间通信全方案
前端·vue.js
雪芽蓝域zzs11 小时前
分页组件 + el-config-provider 中文国际化 + 靠右布局
前端·javascript·vue.js
志尊宝11 小时前
Vue3 零基础每日笔记(016):v-for 列表渲染——key 的作用与为什么不能用 index
javascript·vue.js·笔记