reactjs - 错误 : Too many re-renders. React 限制渲染次数以防止无限循环。 react js

Question

我目前正在学习 react ，但我有这个错误

Error: Too many re-renders. React limits the number of renders to prevent an infinite loop.

这是代码

    const [Status, setStatus] = useState(false);
    if (sessionStorage.getItem("token")) {
        setStatus(true);
    }```

Answer 1

您在渲染组件时正在进行状态更改。通过进行状态更改，您将触发新的渲染，因此您将创建一个渲染循环。

您必须使用 useEffect Hook 才能在首次加载时将本地状态设置为 token 值。这是文档:

https://reactjs.org/docs/hooks-effect.html

在您的情况下，您必须更换:

if (sessionStorage.getItem("token")) {
     setStatus(true);
}

通过:

useEffect(() => {
   if (sessionStorage.getItem("token")) {
       setStatus(true);
   }
}, [])

如果您只想在第一次渲染组件时触发它，您可以将依赖项数组保留为空，或者为其提供依赖项，如果它们发生更改将再次触发 useEffect。