简单说明:开发的时候,经常会遇到表格后面跟着操作列,一般都是编辑或者删除,那么 就需要获取到 本行数据相关的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删除) 获取本行相关数据的更多相关文章

  1. elementui table的新增,编辑和删除

    \ 新增 this.tableData.unshift(data); 编辑 this.$set(this.tableData,data.index,data); 删除 rows.splice(inde ...

  2. kafka删除topic及其相关数据

    1.删除kafka存储目录(server.properties文件log.dirs配置,默认为"/tmp/kafka-logs")相关topic目录 2.Kafka 删除topic ...

  3. 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 ...

  4. react 项目实战(七)用户编辑与删除

    添加操作列 编辑与删除功能都是针对已存在的某一个用户执行的操作,所以在用户列表中需要再加一个“操作”列来展现[编辑]与[删除]这两个按钮. 修改/src/pages/UserList.js文件,添加方 ...

  5. 【jquery】【ztree】节点添加自定义按钮、编辑和删除事件改成自己定义事件

    setting添加 edit: { drag: { isCopy: false, isMove: true }, enable: true,//设置是否处于编辑状态 showRemoveBtn: sh ...

  6. layui中table表格的操作列(删除,编辑)等按钮的操作

    暂停和中止按钮功能 if (obj.event === 'del') { layer.confirm('确认中止么', function (index) { $.ajax({ type: " ...

  7. Jquery 实现动态加入table tr 和删除tr 以及checkbox的全选 和 获取加入TR删除TR后的数据

    关于jquery实现动态加入table tr的问题我也不多说了 上面代码非常多地方都有凝视的 关于返回的 编辑后的table 数据 我这里想说的是我直接把他保存成一个连接起来的字符串了 格式 str= ...

  8. DataTable相关操作,筛选,取前N条数据,获取指定列数据

    DataTable相关操作,筛选,取前N条数据,获取指定列数据2013-03-12 14:50 by Miracle520, 2667 阅读, 0 评论, 收藏, 编辑 1 #region DataT ...

  9. linux --> VIM的列编辑操作

    VIM的列编辑操作   一.删除列 1.光标定位到要操作的地方. 2.CTRL+v 进入“可视 块”模式,选取这一列操作多少行. 3.d 删除.   二.插入列 插入操作的话知识稍有区别.例如在每一行 ...

随机推荐

  1. SpringMVC中Map、Model、ModelMap、ModelAndView之间的关系及区别

    首先,在了解这三者之前,需要知道一点:SpringMVC在调用方法前会创建一个隐含的数据模型(Model),作为模型数据的存储容器, 成为”隐含模型”. 如果controller方法的参数为Moedl ...

  2. phpstorm设置xdebug调试

    phpstorm设置xdebug调试# wamp开发环境安装完成以后,打开网页,输入 :localhost 检测xdebug是否开启 3.若xdebug已开启,请找到你wamp或者phpstudy的安 ...

  3. MVC+EFCore 项目实战-数仓管理系统1

    项目背景及需求说明 这是一个数据管理"工具类"的系统,计划有三个核心功能: 1.通过界面配置相关连接字符串,查询数据库的表数据. 2.配置相关模板,生成数据库表. 可以界面填报或通 ...

  4. springboot Jar包开启远程调试

    jar 正常启动 java -jar rest-demo-0.0.1-SNAPSHOT.jar 开启DEBUG模式需追加参数 java -Xdebug -Xrunjdwp:server=y,trans ...

  5. Python 3.10 的首个 PEP 诞生,内置类型 zip() 迎来新特性

    译者前言:相信凡是用过 zip() 内置函数的人,都会赞同它很有用,但是,它的最大问题是可能会产生出非预期的结果.PEP-618 提出给它增加一个参数,可以有效地解决大家的痛点. 这是 Python ...

  6. css实现div多边框_box-shadow模拟多边框、outline描边实现

    在css3中我们知道可以使用box-shadow属性轻松的为元素添加阴影效果,并且可以设置多组效果,每组参数值用逗号隔开.如果把box-shadow特性的两个偏移量 h-shadow .v-shado ...

  7. angular入门--自定义过滤器

    <html ng-app='app1'> <head> <meta name="generator" content="HTML Tidy ...

  8. Xenon's Attack on the Gangs,题解

    题目: 题意: 有一个n个节点的树,边权为0-n-2,定义mex(a,b)表示除了ab路径上的自然数以外的最小的自然数,求如何分配边权使得所有的mex(a,b)之和最大. 分析: 看似有点乱,我们先不 ...

  9. Monkey and Banana 题解(动态规划)

    Monkey and Banana 简单的动态规划 1.注: 本人第一篇博客,有啥不足还请多多包涵,有好的建议请指出.你以为有人读你博客,还给你提意见. 2.原题 Background: A grou ...

  10. 我终于弄懂了Python的装饰器(四)

    此系列文档: 1. 我终于弄懂了Python的装饰器(一) 2. 我终于弄懂了Python的装饰器(二) 3. 我终于弄懂了Python的装饰器(三) 4. 我终于弄懂了Python的装饰器(四) 四 ...