Vue.js, async await functions return empty results

Question

js project where I need to use await/async for getting data from my API.

My code

        const logsFc = async () => {
          let logs = [];
          for (let i = 0; i < this.data.length; i++) {
            const formData = new FormData();

            const getLogsFc = () => {
              getLogs.request(new URLSearchParams(formData), (response) => {
                if (response.status >= 200 && response.status < 300) {
                  localConsoleLog('getLogs', response);
                  return response.data.data;
                }
              });
            };

            let data = await getLogsFc();
            console.warn(data);
            logs.concat(data);
          }

          return logs;
        };

but logs are returned before getting response.

babel.config.js

module.exports = {
  presets: [
    [
      '@babel/preset-env',
      {
        useBuiltIns: 'usage',
        corejs: 3.6,
        modules: false,
      },
    ],
  ],
};

"vue": "^2.6.0"

What am I doing wrong?

getLogsFc isn't returning anything. You probably want to put a return before getLogs.request. — skirtle
– skirtle, Commented Sep 5, 2020 at 14:24
What is getLogs.request? It doesn't appear to return a promise, so you cannot use await here. — Bergi
– Bergi, Commented Sep 5, 2020 at 14:43
In that case, don't pass a callback but use the promise that it creates — Bergi
– Bergi, Commented Sep 5, 2020 at 14:48

Boussadjra Brahim · Accepted Answer · 2020-09-05 14:51:17Z

1

Don't run the callback of the request just return the response :

 const getLogsFc = async () => {
          let response = await getLogs.request(new URLSearchParams(formData));
            if (response.status >= 200 && response.status < 300) {
                  localConsoleLog('getLogs', response);
                  return response.data.data;
                }
            };

            let data = await getLogsFc();

edited Sep 5, 2020 at 14:51

answered Sep 5, 2020 at 14:34

Boussadjra Brahim

90k19 gold badges163 silver badges183 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Bergi Over a year ago

Your response here would be a promise and does not have a .status property

Boussadjra Brahim Over a year ago

you're right i forgot to ad the async/await to the inner function

Collectives™ on Stack Overflow

Vue.js, async await functions return empty results

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related