我有一个函数,当它被调用时,它将遍历一个数组,其中每个项目都会发出一个Axios请求,获取响应并更新状态。我希望能够一个接一个地执行这些请求,因为每个请求都在改变状态。我已经尝试了一些方法,例如使用axios.all / axios.spread,但还无法弄清楚如何动态地应用它。任何帮助将不胜感激!
该函数发出一个请求,请求根据contractId搜索合同的pdf。它返回一个名为Portfolio的对象,其中包含一组合同。本质上,我的屏幕上显示的是合同表,当单击“查找文件”按钮时,每个合同都会在屏幕上逐行更新。
findFiles = () => {
const contracts = this.state.portfolio.contracts;
contracts.map(contract => {
axios
.get(
"http://localhost:57821/Portfolio/FindFile?contractId=" + contract.contractId
)
.then(res => {
this.setState({ portfolio: res.data });
});
});
};
答案 0 :(得分:0)
您需要做的是对数组进行简单的reduce操作:
contracts.reduce((promise, next) => promise.then(() => {
axios.get(
"http://localhost:57821/Portfolio/FindFile?contractId=" + contract.contractId
).then(res => {
this.setState({ portfolio: res.data });
})
), Promise.resolve()).then(...);
答案 1 :(得分:0)
以上解决方案有效,或者您可以创建一种以更明确的方式起作用的方法:
const axios = require('axios');
function makeRequestsFromArray(arr) {
let index = 0;
function request() {
return axios.get('http://localhost:3000/api/' + index).then(() => {
index++;
if (index >= arr.length) {
return 'done'
}
return request();
});
}
return request();
}
makeRequestsFromArray([0, 1, 2]);