vue用reduce实现循环调用接口(上一个接口调用完毕再调用下一个接口)
vue用reduce实现循环调用接口(上一个接口调用完毕再调用下一个接口)
·
在项目中,有时候会需要批量操作,有些更特殊的还需要按顺序调用接口。
🌰:批量下发10个任务,按任务序号顺序下发,同时需要等上一个任务下发完成再进行下一个任务的下发(不然可能会有后面的接口执行更快提前下发的情况)
// 批量下发
multipleIssue() {
const arr = [123, 456, ...id]
var that = this // 改变this指向
function callPromise(item) {
return new Promise((resolve, reject) => {
testInterface({ id: item }).then((res) => {
if (res.status) {
that.$message({ // 方法内部用that替代this
message: '下发成功',
type: 'success'
})
resolve(item)
} else {
that.$message.error(res.msg)
}
})
})
}
const result = arr.reduce((accumulatorPromise, next) => {
return accumulatorPromise.then(() => { // 上一个接口执行完毕再执行下一个
return callPromise(next)
})
}, Promise.resolve())
result.then(e => {
console.log('All Promises Resolved')
})
}
参考:
五种在循环中使用 async/await 的方法里的 reduce 方法
更多推荐
已为社区贡献7条内容
所有评论(0)