Question

我试图通过id使用axios从MySQL数据库中删除项目。在我的Vue组件中，我设置了以下方法来处理删除项目：

deleteTodo(id, index){
        axios.delete('api/todos/' + id).then(function(response){
             console.log(response)
             this.todos.slice(index, 1)
        }.bind(this)).catch((err) => {
              console.log(err)
        })       
}

我在模板中调用deleteTodo，如下所示：

 <li v-for="(todo, index) in todos">
     <span>{{todo.todo}} <button @click="deleteTodo(todo.id, index)">delete</button></span>
 </li>

在我的TodoController我有以下方法：

 public function remove($id)
 {
    DB::table('todos')->where('id', $id)->delete();
    return redirect('todos');
 }

如果我尝试删除某个项目，我会在控制台中收到以下错误：

Error: Request failed with status code 405
Stack trace:
createError@http://localhost:8000/js/app.js line 107 > eval:15:15
settle@http://localhost:8000/js/app.js line 193 > eval:18:12
handleLoad@http://localhost:8000/js/app.js line 86 > eval:77:7

如果我刷新浏览器，它的应用程序项目确实被删除（我也可以通过访问api / todos路由确认它们被删除）。但是，我必须按两次删除按钮并刷新浏览器才能从数据库中删除该项目。

为什么我收到此错误，我该如何解决？

Answer 1

问题很可能来自使用return redirect('todos');的HTTP重定向，而请求是JSON / AJAX请求（来自使用axios的Vue组件），因此应该返回JSON响应。将return语句更改为return response()->json('Deleted');应该可以解决问题。

从数据库中删除引发请求失败，状态代码405错误

1 个答案: