reactjs - 在 Firebase 数据库更改并返回其初始状态后,反应状态未(重新)设置
问题描述
我想在 Firebase 数据库发生更改后重置状态。我的代码如下所示:
const [lists, setLists] = useState({});
//GET THE DATA FOR THE LISTS
useEffect(() => {
async function fetchData() {
let dataObject = {};
await listsRef.once('value', snap => {
snap.forEach(function(result) {
firebase
.database()
.ref('lists')
.child(result.key)
.on('value', snap => {
dataObject[snap.val().id] = snap.val();
setLists(dataObject);
});
});
});
}
fetchData();
}, [props.ListUpdated]);
return Object.getOwnPropertyNames(lists).length > 0 ? (
<React.Fragment>
<StyledMain role="main">
<Layout currentUser={currentUser}>
{Object.keys(widgets).map(key => {
return (
<Card
id={widgets[key].typeId}
key={widgets[key].typeId}
type={widgets[key].type}
UserIndicator="right"
>
<CardContent scrollbar={false}>
{createComponent(lists)}
</CardContent>
</Card>
);
})}
</Layout>
</StyledMain>
</React.Fragment>
) : (
<div>Loading</div>
);
但是在 Firebase 数据库中发生更改后,列表没有被设置并显示他的初始状态。
为什么不使用数据库中的新值重置状态?
解决方案
推荐阅读
- focus - 跳过链接的视觉焦点
- javascript - 如何在 JavaScript 中将多个请求拆分为块
- python - 如何从 FLIR 视频导出文件中提取热帧?
- python - 使用列进行交叉验证折叠
- sql-server - 查询以从不同的选择查询中获取最新记录,然后合并所有
- node.js - 复制文件并用 NodeJS 替换变量
- java - 我在使用 Microsoft Graph Api 甚至使用 PowerShell 命令创建团队时收到 502 Bad gateway 错误
- java - java.lang.IllegalStateException:hybris 1905 中没有当前上下文
- c# - C#循环遍历xml文件中的属性
- python - 如何判断父类的函数是由子类的类方法或实例方法调用的?