Как заполнить и отобразить массив после загрузки данных из хранилища firebase в react

# #arrays #reactjs #firebase #firebase-storage

Вопрос:

Я пытаюсь отобразить список всех файлов из firebase в react. Вот код для загрузки элементов

 import { listAll } from "@firebase/storage";  var i = 0; var myArray = [];  const listRef = ref(storage, "videos"); // Specify folder to get items from listAll(listRef)  .then((res) =gt; {  res.items.forEach((itemRef) =gt; {  console.log(itemRef.name);  myArray.push(lt;ligt;{itemRef.name}lt;/ligt;);  console.log(myArray);  });  }).catch((error) =gt; {  // Uh-oh, an error occurred!  });  

И вот как я пытаюсь отобразить этот массив

 lt;divgt;  lt;ulgt;{myArray.map(function(name, index) {  return lt;li key={ index }gt;{name}lt;/ligt;;  })}  lt;/ulgt; lt;/divgt;   

При загрузке страницы, если я проверяю элементы, появляется пустое

 lt;divgt;  lt;ulgt;lt;/ulgt; lt;/divgt;  

Пожалуйста, посоветуйте, как это сделать. Спасибо!