Как получить первую и последнюю коллекцию из Firestore - PullRequest
0 голосов
/ 11 февраля 2020

Я пытаюсь извлечь данные из Firebase и добавить их во внутреннюю часть div HTML, но я получаю только последнюю коллекцию (Матрица). Однако, когда я запускаю console.log, я получаю все коллекции. Может кто-нибудь помочь?

script: 

const db = firebase.firestore();
const movies = db.collection("movies");

movies.add({
 title: "Jurassic Park",
 Director: "Steven Spielberg"

movies.add({
 title: "The Matrix",
 Director: "The W. brothers"

const container = document.getElementById("container");

movies.onSnashot( snap => {
 for(const movie of snap.docs) {
 const id = movie.id;
 const data = movie.data();

 Console.log(movie.title);
 container.innerHTML = movie.title + " is a great movie"

HTML: 

<div id="container"></div>

1 Ответ

2 голосов
/ 11 февраля 2020

Ваш код просто перезаписывает один и тот же контейнер внутри HTML каждый раз через l oop. Похоже, вы ожидаете, что он будет добавлять новый текст или элементы каждый раз.

Если вы хотите добавить новый текст, попробуйте добавить в container.inner HTML вместо того, чтобы каждый раз перезаписывать его:

container.innerHTML += movie.title + " is a great movie"

Обратите внимание += вместо =. Это, вероятно, также не будет отображаться так, как вы ожидаете, но вы должны по крайней мере увидеть все заголовки mov ie, объединенные в одном элементе.

Поскольку вы используете прослушиватель базы данных, который собирается чтобы вызываться каждый раз, когда что-то в коллекции изменяется, вам также следует рассмотреть возможность удаления содержимого этого контейнера вместо слепого добавления к нему каждый раз:

movies.onSnashot( snap => {
  container.innerHTML = ""
  for(const movie of snap.docs) {
    const id = movie.id;
    const data = movie.data();
    container.innerHTML += movie.title + " is a great movie"
  }
})
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...