循环调用axios请求,如何第一次请求完成执行完逻辑狗在请求第二次
时间: 2024-09-26 11:13:38 浏览: 32
vue axios请求频繁时取消上一次请求的方法
循环调用axios请求并等待每次请求完成后再执行后续逻辑,通常需要结合async/await或者Promise链式调用。以下是一个基本的例子:
```javascript
const axios = require('axios');
let isRequestFinished = false;
function makeRequest(index) {
return new Promise((resolve, reject) => {
axios.get(`your-api-url-${index}`)
.then(response => {
// 执行相应的处理逻辑
console.log(`Request ${index} completed with data:`, response.data);
// 如果这是最后一次请求,设置isRequestFinished为true
if (index === yourLastIndex) {
isRequestFinished = true;
}
// 如果不是最后请求,检查是否所有请求都完成再继续
if (!isRequestFinished) {
resolve(); // 如果不是最后一次,立即返回,让下一个请求开始
}
})
.catch(error => {
reject(error);
});
});
}
// 调用函数,并使用async/await处理循环
async function loopRequests() {
for (let i = 0; i <= yourLastIndex; i++) {
await makeRequest(i);
// 检查isRequestFinished是否为真,如果是则跳出循环
while (!isRequestFinished) {
await new Promise(resolve => setTimeout(resolve, 100)); // 等待100ms再检查
}
}
}
loopRequests();
```
在这个例子中,`makeRequest`函数返回一个Promise,用于控制每个请求的顺序。当最后一个请求完成后,`isRequestFinished`会被设置为`true`,然后外部的`loopRequests`函数会进入一个无限循环等待,直到所有请求都结束。
阅读全文