如何在React函数中使用async await调用函数，所以我可以按顺序获取结果

Question

so I have this function that try to call antoher multiple functions to get all data from every functions, and I expected to call each of function sequentially. the problem is I still got the result that the every functions in getAll() not done sequentially. Anybody know how it should've done?

_getALL = async () => {
        await this.getA();
        await this.getB();
        await this.getC();
        await this.getD();
      }

example one of the functions:

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);
       });
  }

I just started to learn using this async/await metode.any help would be appreciate

Answer 1

i'm not sure but if your function doesn't have a return when you call this one, this await nothing so it continue the script execution. Try to return something.

Answer 2

await will only work with functions that return a promise. Your getA function currently returns nothing, ie undefined . You can fix this by adding a return , like this:

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);
       });
  }