javascript - 使用 orderByChild 和 equalTo 在 Firebase 查询中返回单个子项的值

标签 javascript firebase firebase-realtime-database

我正在尝试提取当前记录在 Firebase 实时数据库中的存储中图像的 URL。

这是一个抢夺游戏 - 屏幕上会有两张牌(左图和右图),当两张牌匹配时,用户将点击抢夺。

我的所有图像网址都按以下方式存储:

database schema

每个树都有一个名为“index”的唯一子树 - 我还有另一棵树,它只是每个图像记录的运行计数。因此,目前我正在运行一个函数来检查当前计数的总数,然后执行随机函数来生成随机数,然后使用 orderByChild 和包含随机索引号的 equalTo 对图像树执行数据库查询。

如果我记录此数据快照,我可以看到一条记录的完整节点(索引、分数、url、用户及其值),但是如果我尝试仅提取 URL,我会返回 Null 值。相当烦人的是,我可以在闲暇时返回术语“URL”,但我无法获得潜在的值(value)。我想知道这是否是因为它是一个字符串而不是数字,但我找不到任何表明这是一个问题的信息。

请记住,我最多只学习了 Javascript 一周左右,所以如果我犯了明显的菜鸟错误,这可能就是原因!

下面的代码片段向您展示了我的意思:

    var indRef = firebase.database().ref('index')
    var imgRef = firebase.database().ref('images')
    var leftImg = document.getElementById('leftImg')
    var rightImg = document.getElementById('rightImg')

    document.addEventListener('DOMContentLoaded', function(){

    indRef.once('value')
    .then(function(snapShot){

        var indMax = snapShot.val()
        return indMax;
    })
    .then(function(indMax){


        var leftInd = Math.floor(Math.random()* indMax + 1)
        imgRef.orderByChild('index').equalTo(leftInd).once('value', function(imageSnap){
            var image = imageSnap.child('url').val();
            leftImg.src=image; 
            })
        })
    })

最佳答案

当您对 Firebase 数据库执行查询时,可能会出现多个结果。因此快照包含这些结果的列表。即使只有一个结果,快照也会包含一个结果的列表。

您的代码需要通过循环 Snapshot.forEach() 来满足该列表的需求:

   imgRef.orderByChild('index').equalTo(leftInd).once('value', function(imageSnap){
       imageSnap.forEach(function(child) {
         var image = child.child('url').val();
         leftImg.src=image; 
       })
    })

关于javascript - 使用 orderByChild 和 equalTo 在 Firebase 查询中返回单个子项的值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49438029/

相关文章:

c# - 用于验证电话的正则表达式

javascript - 有没有一种方法可以在 javascript 中创建 firebase 的 key ?

android - firebase 持久性如何为我的 Android 应用程序存储本地数据

java - Firebase : Can't convert object of type java. lang.String 输入 com.example.g.Model.Cart

javascript - XMLHttpRequest 和 http 流

javascript - Windows Phone 8 IE10 Javascript 调试

ios - 一起使用 Firebase 和 Google 分析?

firebase - Firestore 安全规则 - 权限被拒绝

android - 如何从 firebase 获取特定子数据

javascript - 如何从react-google-map中获取多边形的路径?