使用Firebase实时数据库JS获取子节点值返回undefined问题

你的问题出在对单个节点数据结构的处理上：当获取Notes下的单个子节点时，snapshot2.val()返回的直接是该笔记的完整对象（包含title和text字段），而不是一个包含子键的集合，这时你用for...in循环遍历这个对象，会把title和text当成遍历的键，导致后续取值错误。

修改后的代码 #

function viewNote(note) {
    alert(note)
    var fetchedNote = database.ref('Users/' + localStorage.getItem('username') + "/Notes/" + note)
    fetchedNote.on('value', (snapshot2) => {
        var data = snapshot2.val()
        // 直接从data中获取title和text，无需遍历
        if (data) { // 先判断数据是否存在，避免空值报错
            var ti = data.title
            var te = data.text
            console.log(ti + ", " + te)
        } else {
            console.log("该笔记不存在")
        }
    })
}

为什么原代码会返回undefined？ #

假设你的Firebase数据结构是这样的：

Users
  └── yourUsername
      └── Notes
          ├── note1
          │   ├── title: "我的笔记1"
          │   └── text: "笔记1内容"
          └── note2
              ├── title: "我的笔记2"
              └── text: "笔记2内容"

当你传入note1调用viewNote时，data就是{title: "我的笔记1", text: "笔记1内容"}。原代码的for...in循环会遍历这个对象的两个键：title和text，此时value分别是字符串"我的笔记1"和"笔记1内容"，再去取value.title自然是undefined。

额外建议 #

可以先在回调里打印console.log(data)，确认返回的数据结构是否符合预期，这能帮你快速定位类似的数据结构问题。

内容的提问来源于stack exchange，提问作者computerblade