Vuejs2 如何使用Vue.axios.delete（）删除数据

我是vuejs的新手。使用

axios.delete（）

从fakeserve删除

json

数据时遇到问题

我试着这样做：-

axios.delete（'http://localhost:3000/users/“，{params:{id:this.idToDelete}}
。然后（（响应）=>{
console.log（响应）
}，（错误）=>{
console.log（错误）
})

这是我的html：-

删除

这是我的javascript（src/views/pages/Delete.vue）：

从“Vue”导入Vue
从“axios”导入axios
从“vue axios”导入VueAxios
Vue.use（VueAxios、axios）
导出默认值{
数据（）{
返回{
idToDelete:“”
}
},
方法：{
userIdtoDelete（）{
axios.delete（'http://localhost:3000/users/“，{params:{id:this.idToDelete}}
。然后（（响应）=>{
console.log（响应）
//警报（'响应='+响应）
}，（错误）=>{
console.log（错误）
//警报（'错误='+错误）
})
}
}
}

我的密码在里面

fakeserver也在

当我单击“删除”按钮时，数据未被删除，并收到以下错误消息：-

删除404（未找到）

自动创建一个

GET/users
获取/users/1
帖子/用户
PUT/users/1
修补程序/用户/1
删除/users/1

因此，考虑到这一点，您应该使用

axios.delete(`http://localhost:3000/users/${encodeURIComponent（this.idToDelete）}`）
.then（res=>{console.log（res）}）
.catch（err=>{console.error（err）}）

我认为您的问题在于，您正在调用一个与

（）

vue内联的函数。vue为您执行此操作，请尝试

<v-btn @click="userIdtoDelete" color="error">Delete</v-btn>

删除

我想你触发了两次这个功能

---

此外，您可以尝试使用

v-model

而不是像

userIdtoDelete（$event.target.value）

这样的函数直接捕获

id

，这似乎更像是服务器端代码的问题。你不能调试为什么得到404响应吗？我试着删除id=3。但它正在删除ID 2、3和4。我们可以做些什么来修复它。Thanks@BoidurjaTalukdar当我在本地测试时不会发生这种情况。检查浏览器的网络控制台。正在发送什么

DELETE

请求？他们是否将正确的id附加到requestHello@Phil？这些是我的网络控制台的屏幕截图：和。看起来他们在请求中添加了正确的id。看起来都不错。您如何确切地验证它正在删除错误的记录？你确定你的用户记录都有唯一的id吗？我可以在假服务器上看到它正在删除错误的记录。用户记录都有唯一的id。正如我所写的，你给函数这个值，去掉v型，然后在你的

userIdtoDelete

函数中使用它作为

userIdtoDelete（id）{…}

你可以直接绑定到方法名或者内联调用它。这没有什么区别-@Michael我这样尝试过：userIdtoDelete（id）{Vue.axios.delete（''+id）}但是它正在删除多个具有不同id的记录。从函数中注释所有内容，控制台记录函数接收到的内容，我们可以从那里开始。从函数中注释所有内容。