使用element-ui中的el-table回显已选中数据时toggleRowSelection报错

news2024/10/5 17:19:26

最近在写一个后台,需要在表格中多选,然后点击编辑按钮的时候,需要回显已经选中的表单项

<el-table v-loading="loading" :data="discountList" :row-key="(row) => row.id"  ref='multipleTable' @selection-change="handleSelectionChange">
      <el-table-column type="selection"  width="55" :reserve-selection="true" ></el-table-column>
      <el-table-column property="title" label="名称" width="150"></el-table-column>
 </el-table>
 that.selectionKeys.forEach(key => {
      that.discountList.forEach(row => {
       			if (row.id== key.id) {
       				that.$refs.multipleTable.toggleRowSelection(row, true);
       			}
       	})
  })//这段只是具体逻辑,不包含获取数据 selectionKeys是需要回显的已选中选项,discountList是整个列表的数据

  之前根据以上代码,就可以实现回显,但是这次没有,还报了一个错,报错如下

找了一下原因,这个回显是一个弹框,我在刚进页面就走了这部分逻辑,相当于在请求接口的时候,Dom还未创建。因此报错。所以以后再回显数据的时候,需要先创建好Dom,在进行数据请求回显

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/952650.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

蓝牙链接上的标准串行 (COMx)

1 Preface/Foreword 电脑与蓝牙设备&#xff08;手机&#xff0c;音响&#xff09;连接时&#xff0c;电脑会虚拟出一个串口设备&#xff0c;并在设备管理其中的串口模块下列出。 2 删除方法 在已配对的设备列表中将设备移除。

【Centos8_配置单节点伪分布式Spark环境】

安装centos8 jdk部署伪分布式spark环境 安装Centos8 环境下的JDK 下载jdk linux版本 下载链接&#xff1a; jdk-8u381-linux-x64.tar.gz 将该文件上传到Centos8 主机 部署配置jdk&#xff08;java8&#xff09; # 解压到指定路径 [lhangtigerkeen Downloads]$ sudo tar …

初始react和使用——事件处理、样式处理和组件

一、react官网 1、官网下载 官网分别有中英文两种&#xff1a; 中文官网&#xff1a;React 官方中文文档 – 用于构建用户界面的 JavaScript 库 英文官网&#xff1a;https://reactjs.org/ 2、react简介 react是用于构建用户界面的JavaScript库&#xff0c;起源于Facebook的…

Python入门自学进阶-Web框架——40、redis、rabbitmq、git——3

git&#xff0c;一个分布式的版本管理工具。主要用处&#xff1a;版本管理、协作开发。 常见版本管理工具&#xff1a; VSS —— Visual Source Safe CVS —— Concurrent Versions System SVN —— CollabNet Subversion GIT GIT安装&#xff1a;下载安装文件&#xff1a;…

Nexus仓库介绍以及maven deploy配置

一 、Nexus仓库介绍 首先介绍一下Nexus的四个仓库的结构&#xff1a; maven-central 代理仓库&#xff0c;代理了maven的中央仓库&#xff1a;https://repo1.maven.org/maven2/&#xff1b; maven-public 仓库组&#xff0c;另外三个仓库都归属于这个组&#xff0c;所以我们的…

Oracle21C--Windows卸载与安装

卸载方法&#xff1a; &#xff08;1&#xff09;WinR&#xff0c;输入services.msc,打开服务&#xff0c;把Oracle相关的服务全部停止运行&#xff08;重要&#xff09; &#xff08;2&#xff09;WinR&#xff0c;输入regedit&#xff0c;打开注册表&#xff0c;删除Oracle开…

国产芯片设备达到3纳米,还打入台积电,美日荷被彻底赶出市场

由于众所周知的原因&#xff0c;荷兰和日本的光刻机对中国供应面临限制&#xff0c;其他芯片设备和材料也受到很大的限制&#xff0c;这促使国产芯片产业链积极完善&#xff0c;以实现纯国产芯片工艺&#xff0c;虽然在光刻机方面还稍微落后&#xff0c;不过有一项国产芯片设备…

Maven入门教程(三):Maven语法

视频教程&#xff1a;Maven保姆级教程 Maven入门教程(一)&#xff1a;安装Maven环境 Maven入门教程(二)&#xff1a;idea/Eclipse使用Maven Maven入门教程(三)&#xff1a;Maven语法 Maven入门教程(四)&#xff1a;Nexus私服 Maven入门教程(五)&#xff1a;自定义脚手架 6.Mav…

2023年高教社杯数学建模思路 - 案例:粒子群算法

文章目录 1 什么是粒子群算法&#xff1f;2 举个例子3 还是一个例子算法流程算法实现建模资料 # 0 赛题思路 &#xff08;赛题出来以后第一时间在CSDN分享&#xff09; https://blog.csdn.net/dc_sinor?typeblog 1 什么是粒子群算法&#xff1f; 粒子群算法&#xff08;Pa…

Qt按钮按动、划过背景设置

title: Qt按钮按动、划过背景设置 date: 2023-08-30 19:29:49 tags: Qt按钮按钮背景设置按钮动态效果 categories:Qt学习之路 给按钮添加背景后&#xff0c;原先按钮的按动效果就没了&#xff0c;&#xff08;按钮没有反馈&#xff0c;我的手就会一直在抖&#xff0c;哈哈哈哈…

最新社区团购电商小程序源码 无bug完美运营版+详细搭建部署教程

分享一个开源社区团购电商小程序源码&#xff0c;无bug完美运营版&#xff0c;含完整前后端详细搭建部署教程。 系统运营模式&#xff1a;整合线下社区资源&#xff0c;由各快递代收点、社区便利店、社区物业、业主等发起的社区微信群&#xff0c;推送商品信息&#xff0c;消费…

leetcode原题: 最小值、最大数字

题目1&#xff1a;最小值 给定两个整数数组a和b&#xff0c;计算具有最小差绝对值的一对数值&#xff08;每个数组中取一个值&#xff09;&#xff0c;并返回该对数值的差 示例&#xff1a; 输入&#xff1a;{1, 3, 15, 11, 2}, {23, 127, 235, 19, 8} 输出&#xff1a;3&…

运维Shell脚本小试牛刀(三)::$(cd $(dirname $0); pwd)命令详解

运维Shell脚本小试牛刀(一) 运维Shell脚本小试牛刀(二) 运维Shell脚本小试牛刀(三)::$(cd $(dirname $0)&#xff1b; pwd)命令详解 一&#xff1a; $(cd $(dirname $0); pwd) 命令详解 path $(cd $(dirname $0); pwd)解析&#xff1a; 1、取当前运行脚本的所在路径&#xf…

【AI模型】LibTorch深度学习框架配置与使用

&#x1f60f;★,:.☆(&#xffe3;▽&#xffe3;)/$:.★ &#x1f60f; 这篇文章主要介绍LibTorch深度学习框架配置与使用。 学其所用&#xff0c;用其所学。——梁启超 欢迎来到我的博客&#xff0c;一起学习&#xff0c;共同进步。 喜欢的朋友可以关注一下&#xff0c;下次…

Jmeter性能压测 —— 高并发思路

测试场景&#xff1a;模拟双11&#xff0c;百万级的订单量一个物流信息的查询接口。 条件&#xff1a;接口响应时间<150ms以内。10万并发量每秒。 设计性能测试方案 1、生产环境 ①10W/S--并发量&#xff08;架构师/技术负责人提供&#xff09; ②20台机器&#xff08;…

java八股文面试[多线程]——ThreadLocal底层原理和使用场景

源码分析&#xff1a; ThreadLocal中定义了ThreadLocalMap静态内部类&#xff0c;该内部类中又定义了Entry内部类。 ThreadLocalMap定了 Entry数组。 Set方法&#xff1a; Get方法&#xff1a; Thread中定义了两个ThreaLocalMap成员变量&#xff1a; Spring使用ThreadLocal解…

STP生成树

文章目录 一、二层环路带来的问题二、生成树定义三、STP相关概念BPDU&#xff08;Bridge Protocol Data Unit&#xff09;定义分类用来选举的参数 四、STP的选举机制五、STP初始化流程交换机端口状态 六、STP计时器七、STP拓扑变更机制八、STP的问题九、RSTP&#xff08;Rapid …

200 Smart 与 PLC 4000 PN/PN Coupler通讯

1、打开200 smart 菜单栏选择工具&#xff0c;profinet网络&#xff0c;添加控制器 2、200 Smart PN /PN Coupler 做为控制器组态IO均配置128个BYTE. 3、S7400 在硬件配置里组态 PN/PN Coupler通讯 并添加报文长度为128BYTE 4、通过程序将200 msart中的IO点写到DB数据块内

c++11 标准模板(STL)(std::basic_stringstream)(一)

定义于头文件 <sstream> template< class CharT, class Traits std::char_traits<CharT> > class basic_stringstream;(C11 前)template< class CharT, class Traits std::char_traits<CharT>, class Allocator std::alloc…

机器学习基础17-基于波士顿房价(Boston House Price)数据集训练模型的整个过程讲解

机器学习是一项经验技能&#xff0c;实践是掌握机器学习、提高利用机器学习 解决问题的能力的有效方法之一。那么如何通过机器学习来解决问题呢&#xff1f; 本节将通过一个实例来一步一步地介绍一个回归问题。 本章主要介绍以下内容&#xff1a; 如何端到端地完成一个回归问题…