【问题标题】:Axios PUT doesn't update dataAxios PUT 不更新数据
【发布时间】:2019-04-25 14:01:46
【问题描述】:

我有这个VueJS 应用程序正在使用AxiosPUT 一个对象到服务器。目标是更新数据库中的这个对象。该对象已存在于数据库中,但使用PUT 发回的对象有一些更改的数据。这些更改是我要更新到数据库的内容。应用程序运行时没有错误消息,但数据库中的数据永远不会更新。

客户端

onUpload(): void {
    this.chosenRoute.name = this.routeName;
    this.chosenRoute.text.paragraphs[0] = this.routeDescription;
    this.chosenRoute.text.preamble = this.preamble;
    if(this.activity != "") this.chosenRoute.activity = this.activity;

    axios.put('http://localhost:8080/route/' + this.selectedRoute, JSON.stringify(this.chosenRoute), {
      onUploadProgress: uploadEvent => {
        console.log('Upload Progress' + Math.round(uploadEvent.loaded / uploadEvent.total) * 100 + " %");
      }
    }).then(res => {
      console.log(res);
    });
  }

服务器端

app.put('/route/:id', function(req, res, next) {
    const routeId = req.params.id;
    res.set("Access-Control-Allow-Origin", "*");
    Route.update({'_id':routeId}, req.body, function(result) {
        return res.send(result);
    });
});

【问题讨论】:

  • 您确定浏览器控制台中没有错误吗?你有什么东西可以处理这会产生的飞行前 OPTIONS 请求吗?给你的服务器端脚本添加一些调试,这样你就可以看到发生了什么?

标签: node.js rest express vue.js axios


【解决方案1】:

我认为你不应该使用JSON.stringify,所以你的代码应该是这样的:

axios.put(`http://localhost:8080/route/${this.selectedRoute}`, this.chosenRoute, {
  onUploadProgress: uploadEvent => {
    console.log('Upload Progress' + Math.round(uploadEvent.loaded / uploadEvent.total) * 100 + " %");
  }
}).then(res => {
  console.log(res);
});

希望对你有帮助!

【讨论】:

  • 可能是因为您的快速应用程序有限制。如果你使用快递,你应该添加app.use(bodyParser.json({limit: '1mb'}));
猜你喜欢
  • 2022-01-05
  • 2021-05-28
  • 2020-11-16
  • 2022-07-17
  • 2020-10-13
  • 2020-04-21
  • 2021-06-03
  • 2018-11-07
  • 2019-08-11
相关资源
最近更新 更多