useEffect-被跟踪变量未更改时的无限循环

Question

我刚开始使用Effect，但阅读文档时我的问题似乎没有任何意义。在我的文件的开头，我正在实例化一个状态和一个变量

const [moduleDisplay, setModule] = useState("")
let moduleRender = <div>Hello World</div>
useEffect(() => {
setModule(moduleRender);
},[moduleRender]);

根据我在第一次渲染时观察到的情况，实际渲染的组件moduleDisplay从""开始，useEffect函数被挂载并以某种方式触发，moduleDisplay的状态被更改为moduleRender，即Hello World组件，从而触发重新渲染。

然而，除了在实际渲染中渲染moduleDisplay之外，这些变量/函数中没有任何一个被使用，所以我看不出moduleDisper是如何被改变的，无论是形状还是形式。但这会导致无限的渲染循环，我不明白为什么。

Answer 1

useEffect中的useState会导致re-render。在re-render的情况下，moduleRender = <div>Hello World</div>再次被分配给<div>Hello World</div>，并且useEffect在.中命中

在这里，你可以找到一篇关于你的问题的很好的文章：https://medium.com/@andrewmint/infinite-loop-in-seeeffect-react-hooks-6748de62871