Api VueJS-方法在第二次单击时触发两次

我的应用程序是一个小的待办事项列表，我正在尝试基于单击来删除任务

{{todo.description}}

我的数据是一个对象数组，它存储在名为

apidata

的变量中

[{
“id”：51，
“所有者”：1，
“名称”：“测试名称”，
“说明”：“测试”，
“完成”：错误，
“更新”：“2021-04-29T17:26:48.768973Z”
}]

这是我的方法，我希望它使用相关任务：

deleteTask（id）{
常数t=这个；
控制台日志（id）
axios
.删除(`http://localhost:8000/todos/${id}/`）
.然后（（）=>{
const idx=this.apidata.findIndex（x=>x.id==id）
console.log（idx）
t、 apidata.拼接（idx，1）
})
},

我第一次点击删除按钮时，一切正常。第二次，它被触发两次，导致记录的

idx

，例如3和-1

为什么会发生这种情况？我如何防止这种情况发生

我已经看到了这一点，但这对我的问题没有帮助：

尝试@click.self=“”和@click.prevent=“”