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 删除. 二.插入列 插入操作的话知识稍有区别.例如在每一行 ...
随机推荐
- Docker 基础知识 - Docker 概述
Docker 是一个开发.发布和运行应用程序的开放平台.Docker使您能够将应用程序与基础架构分离,以便快速交付软件.有了 Docker,你可以像管理应用程序一样管理你的基础设施.通过利用 Dock ...
- Docker编写镜像 发布个人网站
推荐国内镜像中心:网易云镜像----> https://c.163.com/hub#/home 或者歪果镜像---> https://hub.docker.com/ 博客地址:http: ...
- 痞子衡嵌入式:利用i.MXRT1xxx系列ROM提供的FlexSPI driver API可轻松IAP
大家好,我是痞子衡,是正经搞技术的痞子.今天痞子衡给大家介绍的是i.MXRT系列ROM中的FlexSPI驱动API实现IAP. 痞子衡的技术交流群里经常有群友提问: i.MXRT中的FlexSPI驱动 ...
- 线上redis问题修复:JedisConnectionException: Unexpected end of stream.
经过: 项目上线后经常报 Unexpected end of stream.; nested exception is redis.clients.jedis.exceptions.JedisConn ...
- webpack4.*入门笔记
全是跟着示例做的.看下面文章 入门 1.nodejs基础 http://www.runoob.com/nodejs/nodejs-tutorial.html 2.NPM 学习笔记整理 https:// ...
- npm安装加速
1.通过config命令 npm config set registry https://registry.npm.taobao.org npm info underscore (如果上面配置正确这个 ...
- node+ajax实战案例(3)
3.用户注册实现 3.1.注册用户功能的实现逻辑 1 用户在表单上输入注册信息 2 点击注册后,收集用户在表单上输入的注册信息并且发送给后台 3 后台接收用户发送过来的注册信息 4 后台需要处理数据并 ...
- 重学 Java 设计模式:实战备忘录模式「模拟互联网系统上线过程中,配置文件回滚场景」
作者:小傅哥 博客:https://bugstack.cn - 原创系列专题文章 沉淀.分享.成长,让自己和他人都能有所收获! 一.前言 实现不了是研发的借口? 实现不了,有时候是功能复杂度较高难以实 ...
- css3支持动画吗?css3可以用于网页动画的展现吗
CSS3 主要可以分为几个模块:边框和背景,渐变,文字特效,字体,2D/3D转换,动画(过渡动画和动画),选择器,盒模型,多列布局,用户界面. css3动画有2类:一种是transition的,另一种 ...
- 帝国の狂欢(种树)(可撤销DP)
题目描述 马上就要开学了!!! 为了给回家的童鞋们接风洗尘,HZOI帝国的老大决定举办一场狂欢舞会. 然而HZOI帝国头顶上的HZ大帝国十分小气,并不愿意给同学们腾出太多的地方.所以留给同学们开par ...