我做了一个小型的React App，从Firebase数据库中读取数据，
没有可见的错误，除了下面的“ loading”钩子始终为true，但如果一切正常，则应该为false，
这是以下应用程序的代码（或在此处提供https://github.com/Versifiction/firebase-api-github）：
Firebase DB的形状
apigithub-db9e8
pseudos
pseudo: "Versifiction"
src / config / firebase.js
import firebase from "firebase";
const config = {
apiKey: value,
authDomain: value,
databaseURL: value,
};
firebase.initializeApp(config);
export const db = firebase.database();
src / App.js
import React, { useEffect, useState } from "react";
import { db } from "./config/firebase";
import "./App.css";
function App() {
const [list, setList] = useState([]);
const [loading, setLoading] = useState(true);
useEffect(async () => {
try {
db.ref("pseudos").on("value", (snapshot) => {
setList(snapshot.val());
setLoading(false);
});
} catch (err) {
console.log("err ", err);
}
}, []);
useEffect(() => {
console.log("loading ", loading);
}, [loading]);
if (loading) {
return <p>Loading...</p>;
}
return (
<div className="App">
<h1>List</h1>
{list &
list.map((l, i) => (
<>
<p key={i}>{l}</p>
<a href={`http://www.api.github.com/users/${l}`}>Github Link</a>
</>
))}
</div>
);
}
export default App;
您确定用户有权读取数据吗？如果不确定，请检查应用程序的日志记录输出中是否有权限被拒绝的消息。
永远不会错过这种类型的问题的另一种方法是将错误回调添加到on：
db.ref("pseudos").on("value", (snapshot) => {
setList(snapshot.val());
setLoading(false);
}, (error) => {
console.error(error);
})
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句