Firebase Web - 如何从数据库中检索嵌套数据？不断回来[对象对象] [重复]答案

【问题标题】：Firebase Web - How to retrieve nested data from database? Keeping getting back [object Object] [duplicate]Firebase Web - 如何从数据库中检索嵌套数据？不断回来[对象对象] [重复]
【发布时间】：2018-12-06 23:42:48
【问题描述】：

我是 Firebase 的新手，我正在尝试学习如何从 Firebase 检索嵌套数据并在网页上打印出来。我可以在控制台中打印出所有数据，但不能在网页上打印，我将在网页上返回 [object Object]。有人可以向我解释为什么我的网页打印出 [object Object] 吗？它与“ref.on”或“snap =>”有关吗？

这是我从 Firebase 获取数据的函数：

function GetData()
{
  var ref = firebase.database().ref('Scores');
  var PrintData = document.getElementById('PrintOutData');

  ref.on("value", function(snapshot) 
  {
    snapshot.forEach(function(childSnapshot) 
    {
      var childData = childSnapshot.val();
      var id=childData.id;
      console.log(childData);
      ref.on('value', snap => PrintData.innerText = childData);
    });
  });
}

这是我的控制台日志中的内容：console.png

这就是我网页上的内容：web.png

这是我在 Firebase 上的数据：

我想在我的网页上得到的是这样的：

name:"AAA", score:100, time:"30s"
name:"AAA", score:100, time:"30s"
...

非常感谢！

【问题讨论】：

标签： javascript html firebase firebase-realtime-database

【解决方案1】：

哎呀，看起来很糟糕。不知道为什么要嵌套 on("value" 侦听器，我也不知道 .id 来自哪里。您可能正在寻找以下方面的内容：

ref.on("value", function(snapshot) {
  PrintData.innerText = ""; // We got a new value, so clear the existing HTML
  snapshot.forEach(function(childSnapshot)  {
    var childData = childSnapshot.val();
    PrintData.innerText += "name: " + childData.name + " score: " + childData.score + " time: " + childData.time + "    ";
  });
});

【讨论】：

【解决方案2】：

你可以使用：

 let keys = Object.keys(childData)
  keys.forEach(key => {
  let value = childData[key.toString()];
  console.log(value) // Use Value
  })

【讨论】：