Question

这是我的MERN应用程序中最奇怪的事情。当我从Postman执行PUT到我的api时，它可以工作并更新我的api和mongoDB。在前端，即使控制台日志显示正确的值并且网址相同，它也不会更新api？任何帮助或方向将不胜感激...现在已经玩了好几天了。

POSTMAN证明更新工作

我的axios的代码如下：

handlePlayerSubmit(id, player) {
    console.log('This is the id: ' + id);
    console.log('This is the player: ' + player);

    let apiUrl = 'http://localhost:3001/api/teams';
    //sends the id and new author/text to our api
    axios.put(`${apiUrl}/${id}`, player).catch(err => {
      console.log(err);
    });

}

所以我知道它因为控制台日志而被解雇...不确定为什么它没有更新api？

此外，它不是console.logging错误。

DEV工具中的网络屏幕

NETWORK TAB的标题：

Answer 1

这是因为Axios将JavaScript对象序列化为JSON。要以application / x-www-form-urlencoded格式序列化，您需要使用techniques described in the Axios documentation之一。

我认为qs对你来说是一个很好的解决方案：

let apiUrl = 'http://localhost:3001/api/teams';
//sends the id and new author/text to our api
axios.put(`${apiUrl}/${id}`, qs.stringify(player)).catch(err => {
  console.log(err);
});

Answer 2

Axios不喜欢发布普通对象。

解决问题的一种方法是使用FormData：

let formData = new FormData();
formData.append('param1', 'hi');
formData.append('param2', 'hello');

axios({
    method: 'POST',
    url: '/api/some-endpoint/',
    data: data
}).then(response => {
    console.log(response);
});

https://github.com/axios/axios/issues/1195

把作品放在邮差而不是AXIOS

2 个答案: