当一个接口需要依赖另一个接口的请求数据时,通常有两种解决方式
一:将请求数据的接口设为同步,之后调另一个接口
二:在请求数据接口的成功回调里调另一个接口
但是:当一个接口需要依赖很多个接口的请求数据或者一个依赖另一个,另一个再依赖另一个的情况该怎么解决呢?
当然你可以按照单个接口依赖的方式层层嵌套,结果就是代码结构混乱,可读性差,性能差(一个需要依赖很多个的时候要把很多个设为同步)。
// 场景一:先调用Promise1,再调用Promise2,再调用Promise3 ...
function Promise1(){
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve({data:22});
}, 2)
})
}
function Promise2(data){
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve(data);
}, 200)
})
}
function Promise3(data){
return new Promise((resolve, reject) => {
setTimeout(() => {
resolve(data);
}, 200)
})
}
Promise1()
.then((res) => {
// 调用Promise2并传值
return Promise2(res)
})
.then(res => {
// 调用Promise3并传值
return Promise3(res)
})
.then(res => {
// Promise3
console.log(res)
})
.catch((err) => {
console.log('rejectd', err)
})
// 场景二:Promise3的执行依赖Promise1和Promise2
// Promise的all方法,等数组中的所有promise对象都完成执行
Promise.all([Promise1(), Promise2()])
.then(res => {
return Promise3(res)
})
.then(res => {
// Promise3
console.log(res)
})
.catch((err) => {
console.log('rejectd', err)
})