时间戳

首页 > 解决方案 > React - 从 Firebase 检索和打印数据

javascript - React - 从 Firebase 检索和打印数据

问题描述

我是 React 的初学者，我正在尝试了解事情是如何工作的。我尝试使用 Firebase 数据库进行试验，但我不了解这种行为。

这是 CodeSandBox：https ://codesandbox.io/s/react-and-firebase-d3elg

首先，当您打开页面时，您会在控制台中看到：

First ?undefined 
First ?undefined 
Second ?undefined 
Second ?undefined

undefined 的东西没关系，我稍后再讲，但是为什么会打印两次呢？

然后，如果您取消注释第 24 行，我强烈不推荐 :D，您将开始一个无限循环，非常激进。我原以为它只会触发“一次”，就像它在第 10 行上写的那样，但显然它没有......

有人可以帮我理解吗？

非常感谢。

标签： javascriptreactjsfirebaseloopsinfinite

解决方案

您需要将任何您想运行一次的代码放入一个带有空数组依赖项的 useEffect 中，以使其仅运行一次。

但是在下面我编辑沙箱的示例中，我将dbRef其作为依赖项放入，因此每当该值更改时，都会再次调用该函数。

https://reactjs.org/docs/hooks-effect.html

https://codesandbox.io/s/react-and-firebase-xir7p?fontsize=14&hidenavigation=1&theme=dark

推荐阅读