简单vue表格批量删除功能

//删除按钮click触发删除事件

<el-button class="delete" type="delete" @click="delete"></el-button>

<template>
  <el-table ref="multipleTable" :data="tableData"  tooltip-effect="dark" style="width: 100%"
    @selection-change="handleSelectionChange">
    <el-table-column type="selection" width="55"></el-table-column>
    <el-table-column label="日期" width="120">
      <template slot-scope="scope">{{ scope.row.date }}</template>
    </el-table-column>
    <el-table-column prop="name" label="姓名" width="120"></el-table-column>
    <el-table-column prop="address" label="地址" show-overflow-tooltip></el-table-column>
  </el-table>
</template>

 //表格 因为这里需要批量删除所以表格加多选参考vue的element ui官方文档Table表格
https://element.eleme.io/#/zh-CN/component/table

//这里的tableData表格数据声名空数组从后台获取的

  export default {
    data() {
      return {
        tableData: [],
        multipleSelection: []
      }
    },

    methods: {
		//这里是被选中的表格数据为数组
      handleSelectionChange(val) {
        this.multipleSelection = val;
      }
	  //删除事件
	  delete(){
		if(this.multipleSelection==""){
			this.$message.warning('请至少选择一条数据进行删除！')
		}else{
			this.$confirm('此操作将永久删除该权限，是否继续？','提示',{
				confirmButtonText:'确定',
				cancelButtonText:'取消',
				type:'warning',
				center:true
			}).then(()=>{
				// 声明空数组,这里的数组是后端需要的数据
				let arrray=[]
				//遍历勾选数据取自己需要的id等这里是和后端需要的参数对应
				for(let i=0;i<this.multipleSelection.length;i++){
					let obj={}//这里的对象数据是需要删除的数据 这里声明为了不重复
					obj.menuId=this.multipleSelection[i].menuId;
					obj.userId=this.multipleSelection[i].userId;
					arrray.push(obj)//把取出的对象push到数组里
				}
				delete(arrray).then(res=>{ //接口
					console.log(res);
                    this.search();//删完成功后初始化查询列表
				})
			})
		}  
	  }
    }
  }

个人意见 不喜勿喷 谢谢！