javascript - 如何在useeffect钩子(Hook)中停止无限循环

Question

 const [list, setlist] = useState([]);
  const token = localStorage.getItem("token");
  const requestOptions = {
    method: "GET",
    headers: { authorization: `Bearer ${token}` },
  };
  useEffect(() => {
    fetch("http://localhost:3000/recruiter/postedjobs",requestOptions)
      .then((response) => response.json())
      .then((data) => {
        setlist(data.data);
      });
  });

我正在研究 react js，我必须在页面渲染后显示用户列表，所以我使用 useeffect 钩子(Hook)，当我编写 useeffect 钩子(Hook)时它调用 api 无限时间如何阻止它。如果我添加空白依赖项 [] 它显示依赖项中缺少请求选项

Answer 1

将一个空数组作为第二个参数传递给 useEffect Hook。

useEffect( ()=>{
      console.log(‘hello’);
   }, [] );

如果您将 Effect Hook 的第二个参数留空，您将陷入无限循环，因为 Effect Hook 总是在状态更改后运行。由于 Effect Hook 触发了另一个状态变化，它会一次又一次地运行以增加计数。