elementUI type=“selection“多选框选中 删除 回显 赋值问题 回显数组改变选中状态未改变

本文主要是介绍elementUI type=“selection“多选框选中 删除 回显 赋值问题 回显数组改变选中状态未改变,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

业务需求:
点击查询弹列表框
在这里插入图片描述
勾选列表选项保存
在这里插入图片描述
可删除可重新查询列表添加
在这里插入图片描述
遇到的问题:删除之后查询列表selection回显问题
解决:@row-click配合:reserve-selection="true"使用

      <el-tableref="refPlanTable":data="refPlanTableData"tooltip-effect="dark":max-height="400":height="400":header-cell-style="{textAlign: 'center'}":cell-style="{textAlign:'center'}"@selection-change="handleSelectionChangeRef"@row-click="handleRowClickRef":row-key="getRowKey"><el-table-column type="selection" width="55" fixed="left" :reserve-selection="true"></el-table-column></el-table>

handleRowClickRef(row){ this.$refs.refPlanTable.toggleRowSelection(row); },
表格data赋值的地方添加
注意::reserve-selection="true"会记录保存上一次选中的状态,所以每次赋值前要先清空选中状态

          this.refPlanTableData=res.result;let string = this.multipleSelectionRef.map(item => item.identity);console.log(string);this.$nextTick(() => {this.refPlanTableData.forEach(item=>{this.$refs.refPlanTable&&this.$refs.refPlanTable.toggleRowSelection(item,false);if(string.includes(item.identity)){this.$refs.refPlanTable&&this.$refs.refPlanTable.toggleRowSelection(item,true);}})})

这篇关于elementUI type=“selection“多选框选中 删除 回显 赋值问题 回显数组改变选中状态未改变的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1014864

相关文章

SpringBoot内嵌Tomcat临时目录问题及解决

《SpringBoot内嵌Tomcat临时目录问题及解决》:本文主要介绍SpringBoot内嵌Tomcat临时目录问题及解决,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,... 目录SprinjavascriptgBoot内嵌Tomcat临时目录问题1.背景2.方案3.代码中配置t

SpringBoot使用GZIP压缩反回数据问题

《SpringBoot使用GZIP压缩反回数据问题》:本文主要介绍SpringBoot使用GZIP压缩反回数据问题,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录SpringBoot使用GZIP压缩反回数据1、初识gzip2、gzip是什么,可以干什么?3、Spr

Java数组初始化的五种方式

《Java数组初始化的五种方式》数组是Java中最基础且常用的数据结构之一,其初始化方式多样且各具特点,本文详细讲解Java数组初始化的五种方式,分析其适用场景、优劣势对比及注意事项,帮助避免常见陷阱... 目录1. 静态初始化:简洁但固定代码示例核心特点适用场景注意事项2. 动态初始化:灵活但需手动管理代

如何解决idea的Module:‘:app‘platform‘android-32‘not found.问题

《如何解决idea的Module:‘:app‘platform‘android-32‘notfound.问题》:本文主要介绍如何解决idea的Module:‘:app‘platform‘andr... 目录idea的Module:‘:app‘pwww.chinasem.cnlatform‘android-32

C++中初始化二维数组的几种常见方法

《C++中初始化二维数组的几种常见方法》本文详细介绍了在C++中初始化二维数组的不同方式,包括静态初始化、循环、全部为零、部分初始化、std::array和std::vector,以及std::vec... 目录1. 静态初始化2. 使用循环初始化3. 全部初始化为零4. 部分初始化5. 使用 std::a

kali linux 无法登录root的问题及解决方法

《kalilinux无法登录root的问题及解决方法》:本文主要介绍kalilinux无法登录root的问题及解决方法,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,... 目录kali linux 无法登录root1、问题描述1.1、本地登录root1.2、ssh远程登录root2、

shell编程之函数与数组的使用详解

《shell编程之函数与数组的使用详解》:本文主要介绍shell编程之函数与数组的使用,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录shell函数函数的用法俩个数求和系统资源监控并报警函数函数变量的作用范围函数的参数递归函数shell数组获取数组的长度读取某下的

SpringBoot应用中出现的Full GC问题的场景与解决

《SpringBoot应用中出现的FullGC问题的场景与解决》这篇文章主要为大家详细介绍了SpringBoot应用中出现的FullGC问题的场景与解决方法,文中的示例代码讲解详细,感兴趣的小伙伴可... 目录Full GC的原理与触发条件原理触发条件对Spring Boot应用的影响示例代码优化建议结论F

MySQL 中查询 VARCHAR 类型 JSON 数据的问题记录

《MySQL中查询VARCHAR类型JSON数据的问题记录》在数据库设计中,有时我们会将JSON数据存储在VARCHAR或TEXT类型字段中,本文将详细介绍如何在MySQL中有效查询存储为V... 目录一、问题背景二、mysql jsON 函数2.1 常用 JSON 函数三、查询示例3.1 基本查询3.2

SpringSecurity JWT基于令牌的无状态认证实现

《SpringSecurityJWT基于令牌的无状态认证实现》SpringSecurity中实现基于JWT的无状态认证是一种常见的做法,本文就来介绍一下SpringSecurityJWT基于令牌的无... 目录引言一、JWT基本原理与结构二、Spring Security JWT依赖配置三、JWT令牌生成与