如何将axios.all与具有标题和正文的post请求一起使用

Question

我正在使用ReactJS应用程序访问远程API。我需要执行多个POST请求，然后在它们全部完成后执行一个操作。我得出的结论是，使用axios.all是最好的方法。我尝试了以下代码：

var body = {
pov: [
"Annual Value",
"&CurrYear",
"Fund Transfer",
"Project NSP",
"Input View",
"Activity NSP",
"Account NSP",
"Location NSP",
"Department NSP",
getStageNameEN(vNum),
"Line Item NSP",
transfer,
segment
],
columns: [["Flag"]],
rows: [{ row: [entity], data: [flag] }]
};
promises.push(
axios({
method: "post",
url: "/api/setFlag",
headers: {
Authorization: "Basic " + localStorage.getItem("auth"),
"Content-Type": "application/json"
},
data: body
})
);
axios.all(promises).then(function(results) {
//do something here
});

请求是在axios.all部分之前发送的，因为当我删除它时，也发生了同样的情况。当包含axios.all时，代码陷入了循环，或者至少没有执行其中的内容。

当我将axios零件更改为使用axios.post时，我不断出现错误。

使用axios.all执行多个POST请求的正确方法是什么？

Answer 1

我也遇到过这种情况——我想异步上传多个文件。我通过以下操作解决了问题：

let requests = [];
let _cmp = this;
for (let i = 0; i < _cmp.images.length; i++) {
requests.push(function() {
return _cmp.storePhotoRequest(_cmp.images[i]);
});
}
_cmp.$http.all(requests.map(function(r) {
return r();
})).then(axios.spread(function() {
/*more code*/
})

存储照片请求执行此

storePhotoRequest: function(image) {
const config = { headers: { 'Content-Type': 'multipart/form-data' } };
let form = new FormData();
form.append('photo', image.file);
return this.$http.post('some', form, config);
}