Javascript 如何在React函数中使用async wait调用函数,这样就可以按顺序得到结果
所以我有一个函数,它试图调用其他多个函数来获取每个函数的所有数据,我希望按顺序调用每个函数。问题是我仍然得到的结果是getAll()中的每个函数都不是按顺序完成的。有人知道应该怎么做吗Javascript 如何在React函数中使用async wait调用函数,这样就可以按顺序得到结果,javascript,reactjs,Javascript,Reactjs,所以我有一个函数,它试图调用其他多个函数来获取每个函数的所有数据,我希望按顺序调用每个函数。问题是我仍然得到的结果是getAll()中的每个函数都不是按顺序完成的。有人知道应该怎么做吗 _getALL = async () => { await this.getA(); await this.getB(); await this.getC(); await this.getD(); } 示例一功能: getA()
_getALL = async () => {
await this.getA();
await this.getB();
await this.getC();
await this.getD();
}
示例一功能:
getA() {
getUserA.list()
.then((res) => {
const responseData = res.data;
const Datas = responseData.map(b => ({
key: b.id,
name: b.name,
}));
this.setState({ users: Datas });
})
.catch((err) => {
console.log( err);
});
}
我刚刚开始学习使用这个async/await metode。如果您能提供任何帮助,我将不胜感激。我不确定,但是如果您调用这个函数时,您的函数没有返回值,那么这个函数将不等待任何内容,因此它将继续执行脚本。
尝试返回某些内容。
await
仅适用于返回承诺的函数。您的getA
函数当前不返回任何内容,即undefined
。您可以通过添加一个返回值来解决此问题,如下所示:
getA() {
return getUserA.list()
.then((res) => {
const responseData = res.data;
const Datas = responseData.map(b => ({
key: b.id,
name: b.name,
}));
this.setState({ users: Datas });
})
.catch((err) => {
console.log( err);
});
}
你到底是怎么得到这个结果的?因为它应该按顺序运行。好的,那么很清楚:在getA
中,只需在getUserA
之前添加一个return
。函数需要返回一个承诺,让wait
正常工作,就像现在一样,它只返回undefined
@ChrisG是的,就像有时候getB或getC在getA完成之前已经得到了结果一样,有什么我错过的吗?就像Patrick说的,你需要返回承诺:return getUserA.list()…
,this.setState
是异步的,所以即使getB()只在getA()运行之后才运行,也不能保证setState调用的顺序。@PatrickHund,谢谢,但是你能编辑我的代码,通过添加一个返回来显示它应该是怎样的吗?我仍然不知道如何添加它