реализовать функцию onSnapshot для получения обновлений в реальном времени в коде reactjs - PullRequest
0 голосов
/ 09 мая 2020

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

db.collection("Cities").onSnapshot((snapshot) => {

    snapshot.docs.forEach((doc) => {
         console.log(doc.data());
    });

});

Но теперь, как я могу реализовать это в следующем коде

 getMyInfo = () => {
        db.collection("Cities")
            .limit(8)
            .get()
            .then((docs) => {
                if (!docs.empty) {
                    let AllCities = [];
                    docs.forEach(function (doc) {
                        const city = {
                            id: doc,
                            ...doc.data(),
                        };
                        AllCities.push(city);
                    });
                    this.setState(
                        {
                            cities: AllCities,
                        },
                        () => {
                            this.setState({
                                isLoaded: true,
                            });
                        }
                    );
                }
            });
    };

Спасибо

1 Ответ

1 голос
/ 09 мая 2020

Вы сохраняете все свои города в своем штате. Используйте его для добавления или обновления новых (или обновленных) городов.

Может быть, вы можете попробовать что-то вроде этого:

db.collection("Cities").onSnapshot((snapshot) => {
  snapshot.docs.forEach((doc) => {
    const updatedCity = doc.data();
    const cities = [...this.state.cities];
    const index = this.state.cities.findIndex(c => c.id === updatedCity.id);

    if (index >= 0) {
      cities[index] = updatedCity;
    } else {
      cities.push(updatedCity);
    }

    this.setState({ cities });
  });
});
...