<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. OpenFOAM中的基本变量快速认知【转载】

    转载自:http://blog.sina.com.cn/s/blog_a0b4201d0102vsf9.html label 实际上就是整型数据的变体,int,OF对它进行了包装,以适应32或64位系 ...

  2. 2018-2019-2 网络对抗技术 20165202 Exp8 Web基础

    博客目录 一.实践内容 Web前端HTML 能正常安装.启停Apache.理解HTML,理解表单,理解GET与POST方法,编写一个含有表单的HTML Web前端javascipt 理解JavaScr ...

  3. centos7.2下查看的java版本号

    1,centos7.2下查看的java版本号 java -version

  4. OpenJudge计算概论-大象喝水

    /*========================================================= 大象喝水 总时间限制: 1000ms 内存限制: 65536kB 描述 一只大象 ...

  5. SQL-W3School-函数:SQL MAX() 函数

    ylbtech-SQL-W3School-函数:SQL MAX() 函数 1.返回顶部 1. MAX() 函数 MAX 函数返回一列中的最大值.NULL 值不包括在计算中. SQL MAX() 语法 ...

  6. Ionic4.x 内置颜色

    primary/secondary/tertiary /success/warning/danger/dark/medium/light

  7. [Java复习] 设计模式 Design Pattern

    设计模式的六大原则 1.开闭原则(Open Close Principle) 对扩展开放,对修改关闭. 2.里氏代换原则(Liskov Substitution Principle) 任何基类可以出现 ...

  8. 002-创建型-00-简单工厂【非23种GOF设计模式】

    一.概述 简单工厂模式是属于创建型模式,又叫做静态工厂方法(Static Factory Method)模式,但不属于23种GOF设计模式之一. 简单工厂模式是由一个工厂对象决定创建出哪一种产品类的实 ...

  9. Linux (Ubuntu)安装ssh

    看ssh服务是否启动 打开"终端窗口",输入sudo ps -e |grep ssh 回车有sshd,说明ssh服务已经启动, 如果没有启动,输入sudo service ssh ...

  10. vmware安装centos7.5、配置网卡、环境配置

    1.vmware安装centos7.5虚拟机    参考连接: https://blog.csdn.net/guo_ridgepole/article/details/78973763 可能遇到的问题 ...