javascript - React - useEffect() 中出现错误。这是否会使页面上的所有内容都进入无限循环？

Question

我已将所有类组件转换为功能组件。现在，当我在开发过程中更改 IDE 中的某些代码时，我的页面会陷入无限循环。我几乎可以肯定我的 useEffect() 钩子(Hook)上有一个错误(或丢失)的条件触发变量。但要弄清楚是哪一个还需要一些时间。

所以，我的问题是。有没有一种简单的方法可以找出哪个损坏会导致循环。它也会在构建后循环，还是仅在开发中循环？

根据要求提供代码示例。这是非常基本的，因为我有大约 20 个使用这个原理的人。

import React, {useEffect} from "react";

const Layout = ({ data }) => {
  useEffect(() => {
    // some jQuery stuff
  }, [data.myConditionalVar])

  return (
    <div>
     // my stuff
    </div>
  )
}

Answer 1

每次更改传递的第二个参数时都会调用

useEffect 。在您的情况下，它是data.myConditionalVar。

所以，我假设在 useEffect 中，您正在使用 jquery 更新data，这会强制 React 再次调用 useEffect ，从而导致永远不会-结束循环。