Vuetify v-data-table 行删除：避免误删最后一行的策略

<v-data-table
   :headers="headers"
   :items="tableData"
   :search="search"
>
   <template v-slot:item.actions="{ item }">
      <div class="table__icons">
        <!-- 其他操作图标 -->
        <v-icon
            v-if="$route.name === 'pregled-znsa'"
            small
            @click="openDeleteModal(item)"
        >
            mdi-delete
        </v-icon>
      </div>
   </template>
</v-data-table>

<v-dialog v-model="dialogDelete" max-width="500px">
  <v-card>
    <v-card-title class="text-h2 delete-text">Do you want to remove this row?</v-card-title>
    <v-card-actions>
      <v-spacer></v-spacer>
      <div class="m-btn delete-btn" @click="closeDeleteModal">No</div>
      <div class="m-btn delete-btn" @click="deleteZnsConfirm">Yes</div>
      <v-spacer></v-spacer>
    </v-card-actions>
  </v-card>
</v-dialog>

data: () => ({
    dialogDelete: false,
    deletedZnsIndex: null, // 用于存储待删除项的索引
    deletedZns: {},       // 用于存储待删除项的副本
    tableData: [],        // 你的数据源
    headers: [],          // 你的表格头部配置
    search: ''
}),
methods: {
    openDeleteModal(item) {
       // 错误：这里虽然记录了索引，但在删除时没有使用
       this.deletedZnsIndex = this.tableData.indexOf(item);
       // 错误：这里创建了item的副本，破坏了原始引用
       this.deletedZns = Object.assign({}, item);
       this.dialogDelete = true;
    },
    closeDeleteModal() {
       this.deletedZnsIndex = null;
       this.deletedZns = {};
       this.dialogDelete = false;
    },
    deleteZnsConfirm() {
       // 错误：再次尝试通过副本查找索引，可能返回-1或错误索引
       this.tableData.splice(this.tableData.indexOf(this.deletedZns), 1);
       this.dialogDelete = false;
    }
}

data: () => ({
    dialogDelete: false,
    deletedZnsIndex: null, // 用于存储待删除项的实际索引
    // deletedZns: {},       // 不再需要存储副本，只需索引
    tableData: [],        // 你的数据源
    headers: [],          // 你的表格头部配置
    search: ''
}),
methods: {
    openDeleteModal(item) {
       // 正确：直接存储点击项的实际索引
       this.deletedZnsIndex = this.tableData.indexOf(item);
       // 注意：如果你的数据项没有唯一的标识符，且tableData可能包含引用相同的对象，
       // 或者item本身就是tableData中的一个引用，这种方法是有效的。
       // 如果item是经过某种转换或复制的，你可能需要通过一个唯一的ID来查找索引。
       // 例如：this.deletedZnsIndex = this.tableData.findIndex(d => d.id === item.id);
       this.dialogDelete = true;
    },
    closeDeleteModal() {
       this.deletedZnsIndex = null; // 清除索引
       // this.deletedZns = {};    // 不再需要
       this.dialogDelete = false;
    },
    deleteZnsConfirm() {
       // 正确：使用之前存储的准确索引进行splice操作
       if (this.deletedZnsIndex !== null && this.deletedZnsIndex !== -1) {
           this.tableData.splice(this.deletedZnsIndex, 1);
       } else {
           console.warn("Attempted to delete with an invalid index.");
       }
       this.dialogDelete = false;
       this.deletedZnsIndex = null; // 删除后重置索引
    }
}