Хобрук: Ваш путь к мастерству в программировании

Как отображать данные из firestore с помощью React Native

Я пытаюсь отобразить данные из firestore на домашней странице, но мне кажется, что это не работает. Я хочу показать все данные в коллекции. коллекция включает имя, идентификатор, местоположение и т. д.

    import Firebase from "./lib/firebase";
import { useEffect, useState } from "react";
import { SnapshotViewIOS } from "react-native";
// export async function getRestaurants(restaurantsRetrieved) {
//   var restaurantList = [];

//   var snapshot = await firebase.firestore().collection("Restaurants").get();

//   snapshot.forEach((doc) => {
//     restaurantList.push(doc.data());
//   });

//   restauantsRetrieved(restaurantList);
// }
export default () => {
  const [restaurantsList, setRestaurantsList] = useState([]); //Initialise restaurant list with setter
  const [errorMessage, setErrorMessage] = useState("");

  const getRestaurants = async () => {
    try {
      const list = [];
      var snapshot = await Firebase.firestore().collection("Restaurants").get();
      console.log("Here");
      snapshot.forEach((doc) => {
        list.push(doc.data());
      });
      setRestaurantsList(list);
    } catch (e) {
      setErrorMessage(
        "There's nae bleeding restaurants, I told you to upload them!"
      );
    }
  };

  //Call when component is rendered
  useEffect(() => {
    getRestaurants();
  }, []);

  return (

  <View style={tailwind('py-10 px-5')}>
    <Text style={tailwind('text-4xl font-bold')}>
      {restaurantsList}
    </Text>
};

Ответы:


1

Штат не обновляет, потому что он просто берет ссылку на список. Поэтому вам нужно обновить подобный код ниже

.....

setRestaurantsList([...list]);

...... 

11.07.2020
  • Привет, @Ferin, я получаю эту ошибку, тогда ошибка: объекты недопустимы в качестве дочернего элемента React (найдено: объект с ключами {адрес, долгота, идентификатор, изображение (URL), имя, цена, телефон, широта}). Если вы хотели отобразить коллекцию дочерних элементов, используйте вместо этого массив. 11.07.2020
  • {RestaurantsList} вы не можете распечатать такие данные внутри тега ‹View›. 11.07.2020
  • Теперь его работа просто должна была поместить возврат в FlatList! Спасибо 11.07.2020
  • Новые материалы

    5 проектов на Python, которые нужно создать прямо сейчас!
    Добро пожаловать! Python — один из моих любимых языков программирования. Если вы новичок в этом языке, перейдите по ссылке ниже, чтобы узнать о нем больше:

    Dall-E 2: недавние исследования показывают недостатки в искусстве, созданном искусственным интеллектом
    DALL-E 2 — это всеобщее внимание в индустрии искусственного интеллекта. Люди в списке ожидания пытаются заполучить продукт. Что это означает для развития креативной индустрии? О применении ИИ в..

    «Очень простой» эволюционный подход к обучению с подкреплением
    В прошлом семестре я посетил лекцию по обучению с подкреплением (RL) в моем университете. Честно говоря, я присоединился к нему официально, но я редко ходил на лекции, потому что в целом я нахожу..

    Освоение информационного поиска: создание интеллектуальных поисковых систем (глава 1)
    Глава 1. Поиск по ключевым словам: основы информационного поиска Справочная глава: «Оценка моделей поиска информации: подробное руководство по показателям производительности » Глава 1: «Поиск..

    Фишинг — Упаковано и зашифровано
    Будучи старшим ИТ-специалистом в небольшой фирме, я могу делать много разных вещей. Одна из этих вещей: специалист по кибербезопасности. Мне нравится это делать, потому что в настоящее время я..

    ВЫ РЕГРЕСС ЭТО?
    Чтобы понять, когда использовать регрессионный анализ, мы должны сначала понять, что именно он делает. Вот простой ответ, который появляется, когда вы используете Google: Регрессионный..

    Не зря же это называют интеллектом
    Стек — C#, Oracle Опыт — 4 года Работа — Разведывательный корпус Мне пора служить Может быть, я немного приукрашиваю себя, но там, где я живу, есть обязательная военная служба на 3..