背景
在循环中请求异步方法,在常规使用中异步方法执行的顺序不可控制,再各个异步方法需要各自的返回参数时,当下一个异步方法执行需要上一个方法返回的参数,可能下一个异步方法会优先执行,造成报错
async await 异步方法请求成功后再执行下一次循环,使得异步顺序强制变为同步(同步大于异步,同步方法执行结束后再执行异步)
示例代码
// 获取评论数据
const getData = async () => {
try {
// 等待获取了返回的数据再执行下一步
const res = await getFeed({
softId: route.query.softId,
userId: useID,
})
// 重置数据
myFeedback.value = []
for (let index = 0; index < res.data.records.length; index++) {
const item = res.data.records[index]
myFeedback.value.push(item)
// 在数据中添加评论量字段 等待获取了返回的数据再执行下一步
myFeedback.value[index].number = await getNum(item.id)
}
} catch (error) {
console.error('Error fetching data:', error)
}
}
// 获取评论量
const getNum = async (id: any) => {
try {
// 等待获取了返回的数据再执行下一步
const res = await getCommentNum({
softId: Number(route.query.softId),
userId: useID,
feedBackId: id,
})
return res.data
} catch (error) {
console.error('Error fetching comment number:', error)
return 0
}
}