前言
在和后端同学对接的过程中,有一个业务逻辑,数组进行遍历发送请求,后端同学在接口里面返回true或false传的参数是否符合条件。最后将符合条件的数据发送给后端同学。
因为请求发送是异步的形式,假如类似下面这种写法
const saveContraCalculateData = (saveData) => {
let _isExceedFlags = []
// selectedDeviceRows:table里面被选中的数据
selectedDeviceRows.map((item) => {
const params = {
id: item.id,
}
apis.calculateAmountIsExceeds(params).then((res) => {
const {
isExceed, remainAmount } = res.data
_isExceedFlags.push(isExceed)
}
}).catch((err) => {
console.log(err) })
console.log(_isExceedFlags) // []
}
因为是异步发送的,所以拿不到数据。_isExceedFlags是空的。
但是又需要通过返回的数据来进行下一步请求,所以可以将异步变为同步。用到promise.all()方法
const saveContraCalculateData = async (saveData) => {
let _isExceedFlags = []
let pl = selectedDeviceRows.map(async (item) => {
const params = {
id: item.id,
}
await apis.calculateAmountIsExceeds(params).then((res) => {
const {
isExceed, remainAmount } = res.data
_isExceedFlags.push(isExceed)
}).catch((err) => {
console.log(err) })
})
// 将异步方法变为同步,数组遍历的写法
// for (let i = 0; i < pl.length; i++) {
// await pl[i];
// }
// promise的写法
await Promise.all(pl)
console.log(_isExceedFlags) // ['...',''...,'...']
}
这个时候能拿到数据,就可以做自己想做的各种操作了
注意:用到了await函数要用async接收
调用
saveContraCalculateData()