从Firebase Realtime数据库获取单个元素

时间:2020-04-13 23:28:52

标签: javascript firebase firebase-realtime-database

如果有人可以提供帮助,将不胜感激。

我正在尝试从我的Firebase数据库中接收单个元素,并将所述元素放入表中。我已经完成了一次任务,但是保存不正确,并且我花了很长时间尝试重新设计js

我的目标是从特定的团队ID(例如1009254444)中获取用户名。

数据库的结构化数据/ xbox / 3787955 / teams / 109254444 userName值位于此元素“?”之内

https://cfm-stats.firebaseio.com/data.json

到目前为止,我的代码是

HTML

    <!-- The core Firebase JS SDK is always required and must be listed first -->
<script src="https://www.gstatic.com/firebasejs/7.13.2/firebase.js"></script>

<div class="table-responsive">
  <table class="table table-hover table-standings sortable">
    <table>
      <thead>
        <th>Coach</th>
      </thead>
      <tbody id='userName'></tbody>
    </table>
  </table>
</div>

css

    table {
  border-collapse: collapse;
  width: 100%;
}

th,
td {
  padding: 3px;
  text-align: center;
  border-bottom: 1px solid #ddd;
}

tr:hover {
  background-color: #aa010b;
  color: #ffffff;
}

js

        // Your web app's Firebase configuration
        var firebaseConfig = {
          apiKey: "****",
          authDomain: "****",
          databaseURL: "****",
          projectId: "cfm-stats",
          storageBucket: "****",
          messagingSenderId: "****",
          appId: "****",
          measurementId: "****"


}

    ;
    firebase.initializeApp(firebaseConfig);
    var rootRef = firebase.database().ref('data/xbox/3787955/teams');
    var ref = rootRef.child('1009254444');
    ref.on('value', function(snap) {
        document.getElementById("userName").innerHTML = "";
        snap.forEach(function(child) {
          var childData = child.val();
          var userName = childData.userName;
          document.getElementById("userName").innerHTML += "<tr><td> " + userName + "</td></tr>";
        });
      }

    );

1 个答案:

答案 0 :(得分:0)

这似乎是相关代码:

class Item
  include Mongoid::Document

  field :button_color, type: String # default `nil`

  belongs_to :user, touch: true

  before_validation :set_button_color

  private

  def set_button_color
    self.button_color ||= user&.button_color
  end
end

这正在读取路径firebase.initializeApp(firebaseConfig); var rootRef = firebase.database().ref('data/xbox/3787955/teams'); var ref = rootRef.child('1009254444'); ref.on('value', function(snap) { document.getElementById("userName").innerHTML = ""; snap.forEach(function(child) { var childData = child.val(); var userName = childData.userName; document.getElementById("userName").innerHTML += "<tr><td> " + userName + "</td></tr>"; }); } ); ,该路径指向此URL和此数据:

/data/xbox/3787955/teams/1009254444

现在在回调中执行{ "abbrName" : "BKN", "awayLosses" : 1, "awayTies" : 0, "awayWins" : 6, "calendarYear" : 2021, "capAvailable" : 5940000, "capRoom" : 218000000, "capSpent" : 212060000, "cityName" : "Brooklyn", "confLosses" : 4, "confTies" : 0, "confWins" : 7, "conferenceId" : 996409344, "conferenceName" : "AFC", "defPassYds" : 3036, "defPassYdsRank" : 14, "defRushYds" : 1464, "defRushYdsRank" : 15, "defScheme" : 14, "defTotalYds" : 4500, "defTotalYdsRank" : 14, "displayName" : "Beats", "divLosses" : 3, "divName" : "AFC East", "divTies" : 0, "divWins" : 2, "divisionId" : 1007288320, "divisionName" : "AFC East", "homeLosses" : 5, "homeTies" : 0, "homeWins" : 3, "injuryCount" : 1, "logoId" : 141, "netPts" : -1, "nickName" : "Beats", "offPassYds" : 2296, "offPassYdsRank" : 30, "offRushYds" : 1297, "offRushYdsRank" : 24, "offScheme" : 2, "offTotalYds" : 3593, "offTotalYdsRank" : 32, "ovrRating" : 81, "playoffStatus" : 1, "prevRank" : 1, "primaryColor" : 6501524, "ptsAgainst" : 26, "ptsAgainstRank" : 21, "ptsFor" : 26, "ptsForRank" : 12, "rank" : 10, "seasonIndex" : 2, "secondaryColor" : 11579052, "seed" : 6, "stageIndex" : 1, "tODiff" : 7, "teamId" : 1009254444, "teamName" : "Beats", "teamOvr" : 81, "totalLosses" : 6, "totalTies" : 0, "totalWins" : 9, "userName" : "SnapDan", "weekIndex" : 15, "winLossStreak" : 255, "winPct" : 0.6 } 。但是您正在读取的JSON中没有重复的结构,因此此snap.forEach实际上将遍历每个属性:forEachabbrNameawayLosses等。< / p>

您可能想删除循环:

awayTies

或者,也可以在树中听上一层,这样您就可以拥有所有团队:

ref.on('value', function(snap) {
    document.getElementById("userName").innerHTML = "";
    var childData = snap.val();
    var userName = childData.userName;
    document.getElementById("userName").innerHTML += "<tr><td> " + userName + "</td></tr>";
  }
);