所以基本上我开始学习ReactJs，并试图建立一个聊天应用程序 现在这里有添加频道的部分，所以这是我的代码
const [Channels, setChannelState] = React.useState([])
let loadedChannels = []
React.useEffect(() => {
setCurrentUser(props.currentUser)
ref.ref('channels').on('child_added', snap =>{
loadedChannels.push(snap.val())
console.log(loadedChannels)
setChannelState(loadedChannels)
})
},[])
所以当我尝试记录loadedChannels数组时，我得到了所有结果，但是当我尝试将此数组设置为我的状态时，我只得到一个结果 我该如何解决这个问题？
你有一个空数组[]作为第二个参数，它只运行传递给useEffect的函数一次。
你可以告诉 React 跳过应用效果，如果某些值在重新渲染之间没有改变。为此，请将数组作为可选的第二个参数传递给 useEffect，您已经完成了此操作。
如果我们[]作为第二个参数传递，这将只应用一次效果。
我们可以在数组中传递值，只有在更改时才会触发 useEffect 调用。
根据文档
如果要运行效果并仅清理一次(在装载和 卸载(，您可以将空数组 ([]( 作为第二个参数传递。这 告诉 React 你的效果不依赖于 props 的任何值 或状态，因此它永远不需要重新运行。这不会作为特殊处理 case — 它直接遵循依赖数组始终如何 工程。
尝试使用这样的东西：
const [Channels, setChannelState] = React.useState([])
React.useEffect(() => {
let loadedChannels = []
setCurrentUser(props.currentUser)
ref.ref('channels').on('child_added', snap =>{
loadedChannels.push(snap.val())
})
setChannelState([...loadedChannels])
},[])
希望这有帮助，快乐编码!!
useEffect 的第二个参数称为依赖数组。当它为空时，它的行为类似于 componentDidMount((，即它只运行一次，在第一次渲染之后。
您还需要注意在useEffect中设置状态，因为如果操作不正确，这可能会创建无限的重新渲染循环 -setCurrentUser.这还不足以帮助任何进一步的代码。
这是进入 React 的最佳时机。玩得愉快！
为条件呈现传递第二个参数。要了解很少有场景可以告诉我们使用它的可能方法。
有多种场景可以让您在演示中的示例的帮助下更轻松地理解第二个参数的重要性和功能。
场景 1
第二个参数为空数组，
useEffect(() => {
console.log(`You clicked ${count} times`);
},
[ ]) //called only once similar to componentDidMount
如果我们传递一个空数组，则意味着我们对监视任何值不感兴趣，因此除了挂载和卸载之前之外，不会调用 useEffect。这模仿了componentDidMount和componentWillUnmount的工作，它只会运行一次。
场景 2
第二个带值的参数，
useEffect(() => {
console.log(`You clicked ${count} times`);
}, [count]); //function inside useEffect will be called when "count" will be updated
在我们的示例中作为第二个参数(数组(传递的值：count 将负责 useEffect 钩子内函数的执行。如果数组中的值将被更新，则只有这样才会执行该函数。
如果我们有多个 useEffect 钩子，并且只需要更新其中的几个怎么办？条件渲染是光明的。条件呈现是通过传递第二个参数而不是空数组来实现的。数组中的值将被监视，并且只有在更新监视的值时才会调用 useEffect 函数。
有关详细信息，请参阅这些链接 https://stackblitz.com/edit/react-hooks-intro https://www.c-sharpcorner.com/article/react-hooks-introduction/