Я пытаюсь получить коллекцию компьютеров и поместить их в массив, чтобы я мог отобразить их с помощью карты в моем операторе возврата компонента responsejs. Однако массив всегда пуст. Я предполагаю, что это как-то связано с async / await, но я не могу этого понять.
Вот код.
function Home()
{
let computers = [];
firestore.collection("computers").get().then(function(querySnapshot) {
querySnapshot.forEach(function(doc) {
let data = doc.data();
data.uid = data.id;
computers.push(data);
})
})
console.log(computers.length); // Always returns 0
return (
// Using computers.map to render every computer into its own component
);
}
export default Home;
Да, это из-за этого. Для этого вам нужно будет использовать useState. Документы: reactjs.org/docs/hooks-state.html — person crlegdn schedule 12.01.2021
Здесь вам действительно нужно начать с основ и ознакомиться с React Hooks. Я дам вам код вместе со ссылкой на песочницу, чтобы вы начали.
Идея состоит в том, чтобы получить ваши компьютеры, а затем обновить состояние вашего компонента с помощью полученного значения, что вызовет повторное преобразование компонента со значением состояния, установленным для массива ваших компьютеров. Вот идея: (Песочница: https://codesandbox.io/s/modern-river-p8f92?file=/src/App.js).