vue使用Promise.allSettled频繁请求接口

最新推荐文章于 2024-05-05 23:46:05 发布

十友九

最新推荐文章于 2024-05-05 23:46:05 发布

阅读量470

点赞数 7

分类专栏： VUE 文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/weixin_43778556/article/details/135816635

版权

VUE 专栏收录该内容

34 篇文章 0 订阅

订阅专栏

<button @click="goDetails">请求接口</button>

// 批量请求接口-start
makeRequestWithId(id) {
// 此处为axios请求
  return getProductDetail4Bonus(id, 'normal')
},
sleep(ms) {
  return new Promise(resolve => setTimeout(resolve, ms));
},
async sendRequests(startId, endId, interval) {
	let currentId = startId;
	let arr=[]
	while (currentId <= endId) {
		Promise.allSettled([this.makeRequestWithId(currentId)]).then(results => {
			console.log('results',results)
			results.forEach((result, index) => {
				if (result.status === 'fulfilled') {
					console.log(`请求成功: ID=${currentId}`, result.value.data);
				} else {
					arr.push(currentId)
					console.log(`请求失败: ID=${currentId}`, result.reason);
				}
			});
		  })
		  .catch(error => {
			console.log(`请求遇到错误: ID=${currentId}`, error);
		  });
	
		await this.sleep(interval);
		currentId++;
	}
  console.log('arr',arr)
},
goDetails(){
	// 使用函数发送请求，id 从100到800，间隔为500ms
	this.sendRequests(91, 712, 500);
},
// 批量请求接口-end