时间戳

首页 > 解决方案 > React.js“useEffect”不定式循环

javascript - React.js“useEffect”不定式循环

问题描述

我正在使用一个需要更新数据表并使用 fetch 从 API 获取值的函数。当页面上传时，数据与 useEffect 完美结合，但我希望在我删除或将项目添加到表中时上传它，因为它进入不定式循环，所以现在无法正常工作。

const [data,setData] = useState();


 useEffect(() => {
   
   PersonService.getAllPersonList()
   .then(res => {
     setData(res)
     console.log(res)
   }
 )
 }, [data]);

标签： javascriptreactjs

解决方案

退后一步，考虑一下你在语义上告诉代码做什么。 useEffect基本上意味着，“只要此依赖项发生更改，就执行此操作。”

你的情况是什么操作？

  • 填充data状态值。

什么是依赖？

  • data状态值。

因此，您要告诉代码填充data（根据定义更改的操作data）任何时候data都已更改。

为什么？

由于唯一的依赖项是data那么听起来您只希望在首次安装组件时发生一次。为此，您将使用一个空的依赖数组：

useEffect(() => {
  // your operation
}, []);

在那之后，任何时间data都改变了，那你为什么要重新获取data？您的本地副本已更改。您不想保留这些更改吗？您是否还更改了服务器上的数据并想要完全刷新所有内容？无论哪种情况，这都不是您想要使用的方法。

最有可能的是，data在服务器上修改源的任何操作都应该返回更新的数据，然后调用该操作的客户端代码可以data使用该返回值进行更新。

推荐阅读