Javascript React.js“；“使用效果”；不定式循环

我使用的函数需要更新数据表，并使用fetch从API获取值。当页面上传时，数据与useEffect完美结合，但我希望在删除或向表中添加项时上传数据，该项现在不起作用，因为它进入无限循环

const [data,setData] = useState();


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

---

您的useEffect已订阅“数据”，您也将在useEffect中更新这些数据

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

当“数据”更新时，useEffect将运行。因为useEffect正在更新“数据”，所以有一个无限循环

如果希望useEffect只在加载时运行一次，只需从useEffect中删除数据订阅

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

---

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

你的手术是什么

• 填充

  数据

  状态值

依赖性是什么

• 数据

  状态值

因此，您告诉代码在

数据

发生更改时填充

数据

（根据定义，此操作会更改

数据

）

为什么?

由于唯一的依赖项是

数据

，因此听起来您只希望在首次装入组件时发生一次。为此，您将使用空的依赖项数组：

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

在那之后，任何时候

数据

发生变化，那么您为什么要重新获取

数据

？您的本地副本已更改。您不想保留这些更改吗？您是否也更改了服务器上的数据并希望完全刷新所有内容？无论哪种情况，这都不是您想要使用的方法

---

最有可能的情况是，无论哪个操作修改了服务器上的

数据源

，都应该返回更新的数据，调用该操作的客户端代码随后可以使用该返回值更新

数据

。

我假设在数据更改时使用您的效果，然后您再次更改其中的数据，再一次。。这就是循环开始的地方。非常感谢你的回答。我知道你的意思，并且已经尝试过了，但是我更新“数据”的原因是useEffect是我唯一可以上传代码的地方。因为“PersonService”（类）我使用fetch获取json数据。我试图使export“data”变量更新到PersonService类中，但我做不到。@sametyıldızeli:恐怕那个描述并没有真正澄清任何问题。您的意思是

PersonService

包含更新数据但不从服务器返回更新数据的操作吗？如果是这样的话，我建议修改

PersonService

。或者在您自己的代码中调用该更新操作，然后立即执行一个获取操作。但是如果

useffect

真的像你说的那样是唯一允许你修改代码的地方，那么你就受到了对你施加限制的人的严重限制；类PersonService{getAllPersonList（）{返回fetch（

${URL}/api/Person

）。然后（res=>res.json（）；}}}导出默认的新PersonService（）；我在PersonService类上调用了这个方法。@sametyıldızeli:再一次，退后一步。为什么要在

数据

更改时从服务器重新填充

数据

？因为我使用此数据变量在数据表中显示。每当我添加或删除行中的任何项目时，我希望看到刷新表。有了这段代码，代码就完成了我想要的，这意味着每当我做任何更改时，数据都会被上传。但是用不定式循环。。