我有以下代码，它接受一个包含要重复的HTML字段的插槽：

<div  v-for="(row, index) in rows" :key="index">
      <div class="d-flex justify-content-between ">
        <slot name="fields">
        </slot>
        <input  v-model="row.value" />
        <button @click="removeRow(index)" type="button" class="btn btn-primary waves-effect waves-float waves-light height-10-per  " >
          Remove <i class="fa fa-times-circle"></i>
        </button>
      </div>
    </div>

当我使用removeRow(index)时，它总是移除最后一个插槽。我已经测试了使用<input v-model="row.value">，正确的输入在这里被移除了，但从未移除正确的插槽。

我不需要插槽中的输入是动态的或与Vue交互，我只是想允许用户通过Vue组件动态添加/删除行。

请查看我用于添加/删除行的下面两种方法，以防问题出在这里：

removeRow(index){
      this.rows.splice(index, 1);
    },
    addRow(){
      this.rows.push({value: 'test'})
    }

非常感谢任何帮助。