从Firebase实时数据库中获取单个元素

Question

如果有人能帮忙，我们将不胜感激。

我正试图从我的firebase数据库中接收一个元素，并将所述元素放入一个表中。我已经完成了一次任务，但它没有正确保存，我花了很长时间试图重新配置js

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

数据库是结构化数据/xbox/3787955/teams/109254444用户名值在此元素"？"内

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>";
});
}
);

Answer 1

这似乎是相关的代码：

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>";
});
}
);

这是读取路径/data/xbox/3787955/teams/1009254444，该路径指向此URL和此数据：

{
"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
}

现在在回调中执行snap.forEach。但是您正在读取的JSON中没有重复的结构，所以这个forEach实际上会在每个属性上循环：abbrName、awayLosses、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>";
}
);

或者，在树中听高一级，这样你就可以得到所有团队：

firebase.initializeApp(firebaseConfig);
var rootRef = firebase.database().ref('data/xbox/3787955/teams');
rootRef.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>";
});
}
);