动态创建一个带有v-text-field+ CRUD - v-model问题的表单

data() {
  return {
    form: {
      name: '',
      age: '',
      email: ''
    },
    items: [] // 用于存储表单数据的数组
  }
}

<template>
  <div>
    <div v-for="(item, index) in items" :key="index">
      <v-text-field v-model="item.name" label="Name"></v-text-field>
      <v-text-field v-model="item.age" label="Age"></v-text-field>
      <v-text-field v-model="item.email" label="Email"></v-text-field>
      <v-btn @click="updateItem(index)">Update</v-btn>
      <v-btn @click="deleteItem(index)">Delete</v-btn>
    </div>
    <v-btn @click="addItem">Add</v-btn>
  </div>
</template>

methods: {
  addItem() {
    this.items.push({ name: '', age: '', email: '' });
  },
  updateItem(index) {
    // 实现更新操作的逻辑
  },
  deleteItem(index) {
    this.items.splice(index, 1);
  }
}