element table批量删除

很小的一个问题，但是有细节需要注意

（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="width: 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>