Блог

Я пытаюсь получить данные из объекта карты из Firebase и отобразить их на экране. Проблема в том, что я не могу обрабатывать все, что я получаю от Firebase, как карту. Я проверил «Экземпляр карты, массива и объекта». Он выдает значение true для объекта и false для остальных. Вот как я сохраняю данные в Firebase

 async function handleAddToWatchList() {
    const watchListSnapshot = await watchlistRef
      .where("userId", "==", email)
      .get();
    const watchlistId = watchListSnapshot.docs[0].id;
    const documentRef = watchlistRef.doc(watchlistId);

    documentRef.set(
      {
        tvShows: {
          [data.name]: {
            title: data.name,
            overview: show.overview,
            backdrop: "http://image.tmdb.org/t/p/w500"   data.backdrop_path,
          },
        },
      },
      { merge: true }
    );
  }
 

Когда я регистрирую данные, которые я получаю от Firebase, это выглядит так

 Object {
  "Breach": Object {
    "backdrop": "http://image.tmdb.org/t/p/w500/nz8xWrTKZzA5A7FgxaM4kfAoO1W.jpg",
    "overview": "A hardened mechanic must stay awake and maintain an interstellar ark fleeing the dying planet Earth with a few thousand lucky souls on board... the last of humanity. Unfortunately, humans are not the only passengers. A shapeshifting alien creature has taken residence, its only goal is to kill as many people as possible. The crew must think quickly to stop this menace before it destroys mankind.",
    "release": "2020-12-17",
    "title": "Breach",
  },
  "Wonder Woman 1984": Object {
    "backdrop": "http://image.tmdb.org/t/p/w500/srYya1ZlI97Au4jUYAktDe3avyA.jpg",
    "overview": "Wonder Woman comes into conflict with the Soviet Union during the Cold War in the 1980s and finds a formidable foe by the name of the Cheetah.",
    "release": "2020-12-16",
    "title": "Wonder Woman 1984",
  },
}
 

Как мне выполнить итерацию по этому, чтобы отобразить его на экране?

Вы пробовали цикл for in? Вы можете взглянуть на них здесь => https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for…in

Поскольку у вас есть вложенные объекты, вам, вероятно, придется использовать цикл for in внутри другого цикла for in, чтобы вы могли перебирать родительский объект, а затем перебирать каждый объект.

  const parentObject = {
  "Breach": {
    "backdrop": "http://image.tmdb.org/t/p/w500/nz8xWrTKZzA5A7FgxaM4kfAoO1W.jpg",
    "overview": "A hardened mechanic must stay awake and maintain an interstellar ark fleeing the dying planet Earth with a few thousand lucky souls on board... the last of humanity. Unfortunately, humans are not the only passengers. A shapeshifting alien creature has taken residence, its only goal is to kill as many people as possible. The crew must think quickly to stop this menace before it destroys mankind.",
    "release": "2020-12-17",
    "title": "Breach",
  },
  "Wonder Woman 1984": {
    "backdrop": "http://image.tmdb.org/t/p/w500/srYya1ZlI97Au4jUYAktDe3avyA.jpg",
    "overview": "Wonder Woman comes into conflict with the Soviet Union during the Cold War in the 1980s and finds a formidable foe by the name of the Cheetah.",
    "release": "2020-12-16",
    "title": "Wonder Woman 1984",
  },
}

//iterating parent object
for(let property in parentObject){
  //iterating nested objects
  for(let key in parentObject[property]){
    console.log(parentObject[property][key]);
  }
}


/////////OUTPUT: (values of the keys of the nested objects)

http://image.tmdb.org/t/p/w500/nz8xWrTKZzA5A7FgxaM4kfAoO1W.jpg

A hardened mechanic must stay awake and maintain an interstellar ark fleeing the dying planet Earth with a few thousand lucky souls on board... the last of humanity. Unfortunately, humans are not the only passengers. A shapeshifting alien creature has taken residence, its only goal is to kill as many people as possible. The crew must think quickly to stop this menace before it destroys mankind.

2020-12-17

Breach

http://image.tmdb.org/t/p/w500/srYya1ZlI97Au4jUYAktDe3avyA.jpg

Wonder Woman comes into conflict with the Soviet Union during the Cold War in the 1980s and finds a formidable foe by the name of the Cheetah.

2020-12-16

Wonder Woman 1984