React JS - обещание возвращается до завершения выполнения. Функция asyn c не работает

Question

Я пытаюсь загрузить данные из firebase, вызывая функцию, в которой она фильтрует данные и возвращает их.

Когда я вызываю эту функцию в своей основной функции, она возвращает «undefined». Я знаю, что данные есть (console.log (postsArray)) печатает данные, но я предполагаю, что возврат выполняется до загрузки данных. Что я делаю не так?

calling_Function_in_Main = async () => {
    const data = await FirebaseData ();
    console.log(data);
  };

FirebaseData - это функция, которую я вызываю в своей основной функции для загрузки данных и их возврата

let postsArrays=[];


const FirebaseData = async () => {

  const getViewableLink = async (link) => { //some function  };

  const loadData = async () => {

    const database = firebase.database();
    const data = database.ref();
    const loadProfile = data
      .child('Posts')
      .orderByChild('Active')
      .equalTo(true)
      .once('value', function gotData(data) {

        Object.values(readInfo).forEach(async (element) => {
         element.Option1Link = await getViewableLink(
              preLink + element.Option1Link,
            );
            postsArray.push(element);
          }
        });
      })
      .catch((error) => {
          console.log(error);
        }
      })
      .then((postsArray) => {
          console.log(postsArray);
          return postsArray;
      });
  };

  await loadData();
};
export default FirebaseSwipeData;

Answer 1

Вы не можете использовать foreach с async / await, потому что это не асинхронно. Это блокировка.

у вас есть 2 способа исправить это:

1- Последовательное чтение: вы можете использовать for...of l oop

for(const element of Object.values(readInfo)) {
   element.Option1Link = await getViewableLink(
      preLink + element.Option1Link,
   );
   postsArray.push(element);
}

2 - Чтение параллельно: вы можете использовать Promise.all

await Promise.all(Object.values(readInfo).map(async (element) => {
  element.Option1Link = await getViewableLink(
     preLink + element.Option1Link,
  );
  postsArray.push(element);
}));

Надеюсь, что проблема решит для вас