Javascript 使用对象作为参数的无限循环useEffect[React_Native]

我开始使用钩子，当我试图设置我的状态时，我遇到了一个无限循环问题，我已经在几个论坛上查看过，所有可能的解决方案都没有解决我的问题。 我正试图设置一个对象数组，当我发送update时，它说它不将“state.casas”识别为对象，但当我将“state.casas”作为“[]”内useEffect的第二个参数传递时，它仍在循环中。

---

有人能帮我吗？

你得到了一个无限循环，因为

state.casas

正在不断更新。每次firebase

on

的处理程序触发更新

state.casas

时，它都会导致钩子执行。除此之外，每次执行钩子时，它都会创建新的firebase订阅，这些订阅将在其他现有订阅的基础上运行，每次更新

casas

都会不断导致钩子的更多执行。您的

useffect

可能只能运行一次，因为单个firebase订阅最多是该ref获得实时更新所需的。此外，将处理程序移动到函数将使组件卸载时更容易清理订阅：

  const [ state, setState] = useState({
casas: [],
casaSelecionada: '',
 });




  useEffect(()=>{
    dbref.once('value', function(snapshot, prevChildKey){
      setState({
        casas:(Object.entries(snapshot.val())).map( e => e[1].casaItem),
      });
    });
   dbref.off('value'); // according to the firebase website itself,  
                       //this function serves to remove all callbacks 
                      // from one location.
  },[]);

请注意，在钩子的末尾返回了一个cleanup函数，其中包含

off

。这是为了在组件卸载时删除订阅。否则你可能会有漏洞。请注意，这是一个返回的函数。在您的示例中，您只是简单地调用

off

，而不是返回一个函数，该函数就是所指示的。如果您决定使用

一次

，那么您可能不需要清理功能，但是如果您需要持续的实时更新，

一次

可能不够

---

希望这有帮助

您将得到一个无限循环，因为

state.casas

正在不断更新。每次firebase

on

的处理程序触发更新

state.casas

时，它都会导致钩子执行。除此之外，每次执行钩子时，它都会创建新的firebase订阅，这些订阅将在其他现有订阅的基础上运行，每次更新

casas

都会不断导致钩子的更多执行。您的

useffect

可能只能运行一次，因为单个firebase订阅最多是该ref获得实时更新所需的。此外，将处理程序移动到函数将使组件卸载时更容易清理订阅：

  const [ state, setState] = useState({
casas: [],
casaSelecionada: '',
 });




  useEffect(()=>{
    dbref.once('value', function(snapshot, prevChildKey){
      setState({
        casas:(Object.entries(snapshot.val())).map( e => e[1].casaItem),
      });
    });
   dbref.off('value'); // according to the firebase website itself,  
                       //this function serves to remove all callbacks 
                      // from one location.
  },[]);

请注意，在钩子的末尾返回了一个cleanup函数，其中包含

off

。这是为了在组件卸载时删除订阅。否则你可能会有漏洞。请注意，这是一个返回的函数。在您的示例中，您只是简单地调用

off

，而不是返回一个函数，该函数就是所指示的。如果您决定使用

一次

，那么您可能不需要清理功能，但是如果您需要持续的实时更新，

一次

可能不够

---

希望这有帮助

您可能不希望该useEffect具有任何依赖性

dbref.on

看起来像是对Firebase实时数据库的订阅。如果useEffect运行多次，则每次都会创建额外的订阅。您可能只需要运行一次useEffect。还添加一个返回函数for useEffect以删除

dbref.off（

以在未卸载的组件上清理订阅。在添加函数dbref.off时，在组件上执行dbref.on时，它不会返回数据，而是返回我的空数组。我必须看看您是如何准确地编写的（您是否返回

dbRef.off

），但基本上是一样的：。也就是说，您不需要依赖关系。让我们以向web应用程序中的HTML元素添加事件侦听器为例。您不希望执行

addEventListener（'click'，someHandler）

一次又一次地访问同一个元素。此外，您可能希望在不再需要事件侦听器时删除它以避免泄漏。如果我使用一次，则无需使用“关闭”由于它只执行一次搜索，但无论哪种方式，它都会返回一个未定义的数组。我将编辑代码，以便您可以看到我是如何制作CALL的。我不是说您需要使用

一次
，您可以使用
打开
，但记住在某个时候也要执行
关闭
。如果您用您尝试的方法更新代码，这将非常重要肯定有助于排除故障。您可能不希望该useEffect有任何依赖关系。
dbref.on
看起来像是对Firebase实时数据库的订阅。如果useEffect多次运行，则每次都会创建其他订阅。您可能只希望单次运行useEffect。还需要为useEffect添加一个要删除的返回函数
dbref.off（
在卸载组件时清除订阅。添加函数dbref.off时，在其上执行dbref.on而不是返回数据时，它只返回我的空数组。我必须看看您是如何准确编写的（是否返回
dbref.off
），但基本上是一样的：。也就是说，您不需要依赖关系。让我们以向web应用程序中的HTML元素添加事件侦听器为例。您不会希望执行
addEventListener（'click'，someHandler）
一次又一次地访问同一个元素。此外，您可能希望在不再需要事件侦听器时删除它以避免泄漏。如果我使用一次，则无需使用“关闭”由于它只执行一次搜索，但无论哪种方式，它都会返回一个未定义的数组。我将编辑代码，以便您可以看到我是如何制作CALL的。我不是说您需要使用
一次
，您可以使用
打开
，但记住在某个时候也要执行
关闭
。如果您用您尝试的方法更新代码，这将非常重要定义