javascript - Firebase数据库返回null;刷新后,它返回正确的值

标签 javascript firebase firebase-realtime-database

我搜索了现有的讨论,但没有结果,因此我想向社区寻求帮助:我正在使用 JavaScript 从 Firebase 数据库获取数据。最初的获取效果很好;但是,当我向数据库添加子项时,我的 JavaScript 网页最初收到的新子数据为“null”。奇怪的是,如果我刷新网页,“null”就会被正确的数据替换。

这是我的网页来源:

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Reading Firebase Database</title>
        <script type="text/javascript" src="../d3.js"></script>
        <style type="text/css">
            /* No style rules here yet */       
        </style>
    </head>
    <body>

    <div id="div1">
    </div>

        <script src="https://www.gstatic.com/firebasejs/4.9.0/firebase.js"></script>
        <script>

            // Initialize Firebase
            var config = {
                apiKey: confidential,
                authDomain: confidential,
                databaseURL: confidential,
                projectId: confidential,
                storageBucket: confidential,
                messagingSenderId: "confidential"
            };
            firebase.initializeApp(config);

            // Read Firebase Data
            var database = firebase.database().ref().child("session");
            database.on("child_added", snap => {
            var dur = snap.child("dur").val();
            var lat = snap.child("lat").val();
            var lon = snap.child("lon").val();

            // Display Firebase Data
            var para = document.createElement("p");
            var node = document.createTextNode(lon);
            para.appendChild(node);
            var element = document.getElementById("div1");
            element.appendChild(para);

            });

        </script>

    </body>
</html>

这是 Firebase 概要:

Screenshot of Firebase data

预先感谢您的帮助。我真的很感激。

最佳答案

您必须使用on('value')函数来获取每个子项的值。因此,每当添加新子项时,on('value') 都会为 firebase 中的每个子项运行。

var database = firebase.database().ref().child("session");
database.on("value", snap => {
    snap.forEach(snapshot => {
        if ChildKey == newKey {
            console.log(snapshot.val())
        }
    })
});

关于javascript - Firebase数据库返回null;刷新后,它返回正确的值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48546084/

相关文章:

javascript - 如何从Array中抓取某条数据?

javascript - 使用 Firebase Push 键作为第二次推送中的键

javascript - 基于WinJS Promise的文件上传队列

php - Symfony2 和提交机智 JavaScript : How to get html content

javascript - Cloud Functions 返回未定义的预期 Promise 或值

firebase - 如何将 Firebase 和 GCP 项目链接在一起?

Javascript 获取前一个元素的内容

javascript - 如何使用 RecordRTC 录制屏幕+音频+麦克风

c - Arduino 问题 WeMos D1 和 Firebase,异常 (28)

firebase - flutter 从 Firebase 获取插入的 id