onload inside of 'for' with axios call back has an error

Question

I am using axios to load images and then I put that images on window.Image().
After that, I used onload between 'for'.
But when I check '.then', the console.log shows,

hey
0
1
2
3

However, when I delete 'onload', the console.log shows,

0
1
2
3
hey

In my case, I need the onload to run some conditions after image.src.
And, I need

0
1
2
3
hey

How can I solve this situation?

axios
  .get(`http://localhost:4000//${router.currentRoute.params.id}`)
  .then(payload => {
    if (payload.data) {
      firebaseAuth.onAuthStateChanged(user => {
        for (let i = 0; i < payload.data.works.length; i += 1) {
          const payloadImages = payload.data.works[i];

          const imageYo = new window.Image();
          imageYo.src = payloadImages.imagePath;
          imageYo.onload = () => {
            delete payloadImages._id;

            console.log(i);
          };
        }
      });
    }
  })
  .then(() => {
    console.log('hey');
  });

Your `firebaseAuth.onAuthStateChanged(` is both callback-based and currently disconnected from the Promise chain. Convert it to a Promise so that the next `.then` runs only when it finishes — CertainPerformance, Aug 28 '19 at 05:30
convert it to promise try to add async/await or new Promise.all — Robert Anthony S. Tribiana, Aug 28 '19 at 05:34
I understand 50% now. What should I can convert to promise? Because firebaseAuth.onAuthStateChanged is already callback. — DD DD, Aug 28 '19 at 05:38

onload inside of 'for' with axios call back has an error

0 Answers0