很小的一个问题,但是有细节需要注意
(1)问题:在起初我写的时候是根据元素的name是否相同判断是否是同一个节点,出现的问题就是,如果说两个元素的name相同,就会判断出错
(2)代码:
<template> <div class="main"> <div style="margin-top: 20px"> <el-button @click="handleDelete()" type="danger">批量删除</el-button> </div> <template> <el-table class="mytable" :data="tableData" stripe style=" 50%" @selection-change="handleSelectionChange" > <el-table-column type="selection" width="50"></el-table-column> <el-table-column prop="date" label="日期" width="180"> </el-table-column> <el-table-column prop="name" label="姓名" width="180"> </el-table-column> <el-table-column prop="address" label="地址"> </el-table-column> </el-table> </template> </div> </template> <script> export default { data() { return { selectedData: [], tableData: [ { date: "2016-05-03", name: "王小虎1", province: "上海", city: "普陀区", address: "上海市普陀区金沙江路 1518 弄", zip: 200333 }, { date: "2016-05-03", name: "王小虎1", province: "上海", city: "普陀区", address: "上海市普陀区金沙江路 1518 弄", zip: 200333 }, { date: "2016-05-02", name: "王小虎2", province: "上海", city: "普陀区", address: "上海市普陀区金沙江路 1518 弄", zip: 200333 }, { date: "2016-05-04", name: "王小虎3", province: "上海", city: "普陀区", address: "上海市普陀区金沙江路 1518 弄", zip: 200333 } ] }; }, methods: { deleteRow(index, rows) { rows.splice(index, 1); }, handleSelectionChange(data) { this.selectedData = data; }, handleDelete() { var that = this; var val = this.selectedData; if (val) { val.forEach(function(item, index) { that.tableData.forEach(function(itemI, indexI) { if (item === itemI) { that.tableData.splice(indexI, 1); } }); }); } this.$refs.multipleTable.clearSelection(); } } }; </script> <style scoped> .main { padding: 40px; } .mytable { margin-top: 15px; } </style>