Question

我在删除请求时遇到问题，我的帖子，获取工作正常。我在做什么错了？

 removeUser(id) {
      axios.delete('https://jsonplaceholder.typicode.com/users' + id)
      .then(function(response) {
        const user = response.data;
        this.users.splice(id, user);
      });

Answer 1

如果response.status === 204，则删除成功。

对于客户端，这是一个axios示例，请注意在'之后有一个users

destroy() {
    return request.delete('/api/users/' + id)
}

对于服务器，这是一个Laravel示例：

if( $article->delete() ) {
    return response()->json(null, 204);
} else {
    abort(409);
}

Answer 2

在您提供的代码上，我只能看到1个问题。

您正试图通过执行users来修改Vue实例$ data this.users.splice(id, user);对象。但是您在回调函数中，this不再代表Vue实例。要解决此问题并在响应到来后实际修改users对象，您需要这样做：

 removeUser(id) {
  let that = this;
  axios.delete('https://jsonplaceholder.typicode.com/users' + id)
  .then(function(response) {
    const user = response.data;
    that.users.splice(id, user);
  });

现在，我没有来自后端的任何代码，因此我只作一些假设：

路由可能定义不正确>如果您使用的是NodeJS，则应检查路由，如下所示：
```
router.route('/users:id').delete(async function(req,res,next){ /* ... */ });
```
您可能遇到了路由问题，因为在用户值之前缺少/

1条提示：同样，如果您使用的是NodeJS，则可以在.delete路由中使用它：

  res.status(200).json({ errorCode : null , errorMessage : null , users : [] });

查看您是否在前端收到它。

Answer 3

我认为您确实需要在URL末尾附加“ /”，这样可以正确地形成URL，例如“ https://jsonplaceholder.typicode.com/users/123”（而不是“ users123”最后）。

除此之外，Array.prototype.splice的第一个参数是开始删除项目的位置。第二个（可选）参数deleteCount是要删除的项目数。除了deleteCount之外，您还可以传递一组对象，这些对象将在start位置之后和删除项目之后插入。

您只需要在this.users数组中找到对象并将其删除即可。如果要为此使用Array.prototype.splice，则可以使用Array.prototype.findIndex在数组中查找用户的索引，然后将其删除：

// Find the index of the item to remove
const indexOfUserToRemove = this.users.findIndex(u => u.id === id);

// Call splice to remove the item
this.users.splice(indexOfUserToRemove, 1);

Vue axios删除请求不起作用。我如何解决它？

3 个答案: