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

Question

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

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

根据要求提供代码示例。这是非常基础的，因为我有大约 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，从而导致永无止境的循环.

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

React - error in useEffect(). does dat make everything on page go in infinite loop?

javascript

components

reactjs

react-hooks

use-effect