不能使用.once()函数从Firebase数据库读取数据

Can't read data from Firebase database with .once() function

本文关键字：Firebase 数据库 读取 数据 函数 once 不能      更新时间：2023-09-26

我希望能够在按钮触发的onclick事件上从Firebase数据库读取一段数据。从通过文档和这样的似乎once()函数是去这里的方式，因为我不是试图链接数据读取到任何特定的Firebase事件，如添加一个孩子，而是当有人点击页面上的按钮。这里是我调用once()的行…

curPoll.once('value', function(curPollSnapshot) {
    numElections = curPollSnapshot.val().NumElections;
});

问题是我无法获得要读取的数据，即使curPoll被设置为数据引用，numElections是我脚本中的全局变量。numElections不断返回未定义。事实上，我甚至无法在FireBug中进入该函数，好像存在语法错误一样。如果有语法错误，我无法找出它，无论如何，我认为整个脚本在Firebug中根本无法加载，如果是这样的话。但是由于某些原因，我不能深入到函数中去看看是怎么回事。

这是设置curPoll的函数…

function createPoll() 
{
    var pollName = $('#txtCreatePoll').val();
    if (pollName == "" || pollName == null)
    {
         alert("You must enter a name for your poll!");
         return;
    }
    else 
    {
        pollsRef = new Firebase('https://poll-database.firebaseio.com/Polls');
        //TODO add error callback
        curPoll = pollsRef.push({Name: pollName, Elections: null, NumElections: 0 });
        elections = curPoll.push();
        $('div#divCreateElections1').slideDown('slow');
    }
 }

可以看到，elections引用作为curPoll引用的子引用被推送到这里。

下面是我尝试从选举参考....读取数据的函数

            function addElection()
            {
                curPoll.once('value', function(curPollSnapshot) {
                    numElections = curPollSnapshot.val().NumElections;
                });
                var electionName = $('div#divCreateElections' + (parseInt(numElections)+1) + ' > input#txtCreateElection').val();
                var numberToElect = $('div#divCreateElections' + (parseInt(numElections)+1) + ' > input#txtNumElect').val();
                if (electionName == "" || electionName == null)
                {
                    alert("You must enter a name for your election!");
                    return;
                }
            }

正如我所说，numElections不断出现为未定义的。以下是我的firebase数据库的基本结构:

Poll-Database > Polls > Poll1
                        Poll2
                        ...
                        Polln > Name
                              > NumElections
                              > Elections > Election1
                                          > Election2
                                          ...
                                          > Electionn

以防万一，这是我的页面主体…

<body>
    <div id="divCreatePoll">
        Enter Name of New Poll:
        <input type="text" id="txtCreatePoll" value="" />
        <br /><br />
        <button id="btnCreatePoll" onclick="createPoll(); return false;">CREATE POLL</button>
        <p id="pError"></p>
    </div>
    <div id="divCreateElections1">
        Enter Election Name:
        <input type="text" id="txtCreateElection" value="" />
        <br /><br />
        Enter Number of Candidates to Elect:
        <input type="text" id="txtNumElect" value="" />
        <br /><br />
        <button id="btnCreateElection" onclick="addElection(); return false;">CREATE ELECTION</button>  
        <br /><br />
        <p id="pError"></p>
    </div>
</body>

问题是once是一个异步调用。所以它不会立即设置numElections。因此，当您使用numElections时，它还没有被设置。

你只需要把剩下的代码也移到回调中。

function addElection() {
   curPoll.once('value', function(curPollSnapshot) {
      numElections = curPollSnapshot.val().NumElections;
      var electionName = $('div#divCreateElections' + (parseInt(numElections)+1) + ' > input#txtCreateElection').val();
      var numberToElect = $('div#divCreateElections' + (parseInt(numElections)+1) + ' > input#txtNumElect').val();
      if (electionName == "" || electionName == null)
      {
         alert("You must enter a name for your election!");
         return;
      }
   });
}
相关文章：