el-table 操作列(编辑or删除) 获取本行相关数据
简单说明:开发的时候,经常会遇到表格后面跟着操作列,一般都是编辑或者删除,那么 就需要获取到 本行数据相关的id或者其他附属信息。ok,下边放代码
//vue el-table的部分代码
<el-table-column width="200" label="操作" align="center">
<template slot-scope="scope">
<el-button type="danger" icon="el-icon-delete" circle @click.stop="deleteProById(scope.$index, scope.row)"></el-button>
</template>
</el-table-column>
//js 代码
deleteProjectById(params,row){
console.log(params)
console.log(row)
//proVo 是在 data(){} 全局声明的一个对象 此行代码的意思就是 把Object.assign({}, row)获取到的行数据映射为对象
this.proVo = Object.assign({}, row)
console.log(JSON.stringify(this.proVo))
let objId = this.proVo.proId
console.log(objId);
//````其他业务代码省略
}
el-table 操作列(编辑or删除) 获取本行相关数据的更多相关文章
- elementui table的新增,编辑和删除
\ 新增 this.tableData.unshift(data); 编辑 this.$set(this.tableData,data.index,data); 删除 rows.splice(inde ...
- kafka删除topic及其相关数据
1.删除kafka存储目录(server.properties文件log.dirs配置,默认为"/tmp/kafka-logs")相关topic目录 2.Kafka 删除topic ...
- mysql数据库的数据变更事件获取以及相关数据
https://medium.com/@Masutangu/udf-trigger%E5%AE%9E%E6%97%B6%E7%9B%91%E6%8E%A7mysql%E6%95%B0%E6%8D%AE ...
- react 项目实战(七)用户编辑与删除
添加操作列 编辑与删除功能都是针对已存在的某一个用户执行的操作,所以在用户列表中需要再加一个“操作”列来展现[编辑]与[删除]这两个按钮. 修改/src/pages/UserList.js文件,添加方 ...
- 【jquery】【ztree】节点添加自定义按钮、编辑和删除事件改成自己定义事件
setting添加 edit: { drag: { isCopy: false, isMove: true }, enable: true,//设置是否处于编辑状态 showRemoveBtn: sh ...
- layui中table表格的操作列(删除,编辑)等按钮的操作
暂停和中止按钮功能 if (obj.event === 'del') { layer.confirm('确认中止么', function (index) { $.ajax({ type: " ...
- Jquery 实现动态加入table tr 和删除tr 以及checkbox的全选 和 获取加入TR删除TR后的数据
关于jquery实现动态加入table tr的问题我也不多说了 上面代码非常多地方都有凝视的 关于返回的 编辑后的table 数据 我这里想说的是我直接把他保存成一个连接起来的字符串了 格式 str= ...
- DataTable相关操作,筛选,取前N条数据,获取指定列数据
DataTable相关操作,筛选,取前N条数据,获取指定列数据2013-03-12 14:50 by Miracle520, 2667 阅读, 0 评论, 收藏, 编辑 1 #region DataT ...
- linux --> VIM的列编辑操作
VIM的列编辑操作 一.删除列 1.光标定位到要操作的地方. 2.CTRL+v 进入“可视 块”模式,选取这一列操作多少行. 3.d 删除. 二.插入列 插入操作的话知识稍有区别.例如在每一行 ...
随机推荐
- Nginx基本知识,nginx安装使用方法
Nginx 是一款高性能的Web服务器软件. - 具有极高的并发性能 - 利用Nginx与Tomcat组合使用, 搭建反向代理集群 - Nginx 反向代理集群可以解决网站的高并发问题! 1.安装 Y ...
- 入门大数据---Hive视图和索引
一.视图 1.1 简介 Hive 中的视图和 RDBMS 中视图的概念一致,都是一组数据的逻辑表示,本质上就是一条 SELECT 语句的结果集.视图是纯粹的逻辑对象,没有关联的存储 (Hive 3.0 ...
- 并发02--JAVA内存模型
在并发编程中,需要解决两个问题:线程间如何通信&线程间如何同步 线程同步:控制不同线程操作顺序的机制 解决这两个问题的方案有两种:共享内存&消息传递 共享内存:通过使用共享内存,隐式通 ...
- win10 64位 MySQL 8.0 下载与安装
免安装版(超级棒的教程): 安装只需 Download .zip压缩文件 卸载只需 Delete 解压文件即可 https://blog.csdn.net/hzxOnlineOk/article/de ...
- Spring中AOP相关的API及源码解析
Spring中AOP相关的API及源码解析 本系列文章: 读源码,我们可以从第一行读起 你知道Spring是怎么解析配置类的吗? 配置类为什么要添加@Configuration注解? 谈谈Spring ...
- JavaScript图形实例:SierPinski三角形
1.SierPinski三角形 Sierpinski三角形是一种分形,由波兰数学家谢尔宾斯基在1915年提出,它是一种典型的自相似集.其生成过程为: (1)取一个三角形(多数使用等边三角形): (2) ...
- 求助:Runtime exception at 0x004000bc: invalid integer input (syscall 5)
代码 .data S17: .asciiz "the bigger one is:" .text move $fp $sp j main max: lw $t8 ($sp) sub ...
- 虚拟机 - NAT模式下设置静态 IP 地址
背景 如果不给虚拟机设置静态 IP 地址的话,每次重启机器都会自动分配一个新的 IP 如果有多台虚拟机的话,也会动态获取 IP 动态IP的话,每次 设置静态 IP 的步骤 查看本机 IP 和网关 cm ...
- SpringBoot2.x入门教程:理解配置文件
前提 这篇文章是<SpringBoot2.x入门>专辑的第4篇文章,使用的SpringBoot版本为2.3.1.RELEASE,JDK版本为1.8. 主要介绍SpringBoot配置文件一 ...
- List集合-02.LinkedList
2.LinkedList 2.1 UML继承关系图 2.2 底层存储节点 通过内部类Node存储,可以看出是双向的链表结构 private static class Node<E> { E ...