<el-table :data="tableData" stripe border style="width: 100%" @selection-change="changeFun">    //这里做一个事件 checkbox发生改变时触发
<el-table-column type="selection" width="55" ref="multipleTable"></el-table-column>
<el-table-column prop="index" label="序号" width="180"></el-table-column>
<el-table-column prop="flowmeterType" label="设备类型"></el-table-column>
<el-table-column prop="flowmeterNo" label="设备编号"></el-table-column>
<el-table-column prop="flowmeterModel" label="设备型号"></el-table-column>
<el-table-column prop="userName" label="用户姓名"></el-table-column>
<el-table-column prop="phone" label="联系方式"></el-table-column>
<el-table-column prop="installationLocation" label="所属小区"></el-table-column>
<el-table-column prop="regionMap.level1" label="所属二级分区"></el-table-column>
<el-table-column prop="regionMap.level2" label="所属一级分区"></el-table-column>
<el-table-column label="操作">
<template slot-scope="scope">
<el-button size="mini" @click="handleEdit(scope.$index, scope.row)">修改</el-button>
<el-button size="mini" type="danger" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
</template>
</el-table-column>
</el-table>
 
 
data{
  return {
    multipleSelection: [] //返回的是选中的列的数组集合   这里接收用户选中的id  默认放在这个数组里面 
}
}
 
 
methods: {
changeFun(val) { //获取用户的选中
console.log(val);
//this.multipleSelection = val // 返回的是选中的列的数组集合
val.forEach(item => {
this.multipleSelection.push(item.flowmeterId);   //把所有的id放进multipleSelection
})
console.log(this.multipleSelection)
 
},
PLdelete() { //批量删除流量计
console.log(this.multipleSelection)
this.$ajax.delete("/dataManagement/basic/deletedBatch",{flowmeterIds:this.multipleSelection})
.then(res => {
console.log(res);
})
},

项目element-ui checkbox里面获取选中项 实现批量删除 修改的更多相关文章

  1. 使用element ui 日期选择器获取值后的格式问题

    一般情况下,我们需要给后台的时间格式是: "yyyy-MM-dd" 但是使用Element ui日期选择器获取的值是这样的: Fri Sep :: GMT+ (中国标准时间) 在官 ...

  2. jquery操作select下拉框的各种方法,获取选中项的值或文本,根据指定的值或文本选中select的option项等

    简介jquery里对select进行各种操作的方法,如联动.取值.根据值或文本来选中指定的select下拉框指定的option选项,读取select选中项的值和文本等. 这一章,站长总结一下jquer ...

  3. wpf ComboBox 获取选中项的文本内容

    一:根据数据源类型获取选中项 类: public class Region { public int REGION_ID { get; set; } public string REGION_CODE ...

  4. ASP.NET MVC搭建项目后台UI框架—6、客户管理(添加、修改、查询、分页)

    目录 ASP.NET MVC搭建项目后台UI框架—1.后台主框架 ASP.NET MVC搭建项目后台UI框架—2.菜单特效 ASP.NET MVC搭建项目后台UI框架—3.面板折叠和展开 ASP.NE ...

  5. checkbox复选框全选批量删除

    多选框全选实现批量删除 html代码 <body> <form action="" method="post" name="Form ...

  6. Servlet 获取 数组id进行批量删除

    把获取的复选框选中的 id(一般来说都是根据id 进行批量删除的) 从jsp页面 传值到Servlet中 jsp点击事件中: var array=[];  //先声明一个数组变量 var ids=$( ...

  7. c#(winform)中ComboBox添加Key/Value项、获取选中项、根据Key

    WinForm下的ComboBox默认是以多行文本来设定显示列表的, 这通常不符合大家日常的应用, 因为大家日常应用通常是键/值对的形式去绑定它的. 参考了一些网上的例子,最终写了一个辅助类用于方便对 ...

  8. AspxTreeList获取选中项的值

    在csdn上了发了次帖子,没人回复,只有自己结贴了.http://bbs.csdn.net/topics/390706314?page=1#post-396723432 //通过选中的节点获取用户ID ...

  9. Element ui select同时获取value和label的值

    代码如下: <el-form-item v-if="isMD" label="业务员名称"> <el-select v-model=" ...

随机推荐

  1. 学习OpenCV双目测距原理及常见问题解答

    学习OpenCV双目测距原理及常见问题解答 转自博客:https://blog.csdn.net/angle_cal/article/details/50800775 一. 整体思路和问题转化.  图 ...

  2. Multiple commands produce "*.framework"

    参考链接记录个问题,这是xcode10后新build系统导致的,新系统帮我们检查了很多东西,最优化我们的构建, 两种方案 1.用旧的系统(不推荐)   2.这个是build setting->b ...

  3. Java主流锁

    Java主流锁相关知识点概图,为方便预览,将思维导图上传至印象笔记,博客园直接上传图片受限于图片大小. 印象笔记url:https://app.yinxiang.com/shard/s24/nl/27 ...

  4. 2018-2019-2 20165222《网络对抗技术》Exp9 Web安全基础

    1.实践过程记录 1.字符串型注入. 2.整数型注入 3.注入语句查看其他内容 4.xss是一种漏洞,这种漏洞允许用户输入脚本并且浏览器提交的时候不加编码.这种东西是最为流行并且有害的web应用的问题 ...

  5. zsh: no matches found

    具体原因: 因为zsh缺省情况下始终自己解释这个 *.h,而不会传递给 find 来解释. 解决办法: 在~/.zshrc中加入: setopt no_nomatch, 然后进行source .zsh ...

  6. LC 486. Predict the Winner

    Given an array of scores that are non-negative integers. Player 1 picks one of the numbers from eith ...

  7. angular之Rxjs异步数据流编程入门

    Rxjs介绍 参考手册:https://www.npmjs.com/package/rxjs 中文手册:https://cn.rx.js.org/ RxJS 是 ReactiveX 编程理念的 Jav ...

  8. python小白之数组索引

    索引 numpy中的数组索引形式和Python是一致的.如: np.arange(10) print x[2]  #单个元素,从前往后正向索引.注意下标是从0开始的. print x[-2]  #从后 ...

  9. VGG网络-ILSVRC-2014亚军

    用于大尺度图片识别的非常深的卷积网络 使用一个带有非常小的(3*3)的卷积核的结构去加深深度,该论文的一个十分重要的改进就是它将卷机网络的深度增加到了16-19层,且可以用于比较大224*224的图片 ...

  10. java接口如何有效防止恶意请求

    java接口如何有效防止恶意请求?已解决   解决方法: 1.在redis数据库db0中新建一个名为rd_sms_request_count表,表结构: Ip:客户请求的ip Success_coun ...