错误："Too many re-renders. React limits the number of renders to prevent an infinite loop"

Question

如何防止此错误？

错误：重新渲染过多。React限制渲染次数以防止无限循环
我的代码

import React, { useState, useEffect, useRef } from "react";
const Dropdown = ({ options, selected, onSelectedChange }) => {
const [open, setOpen] = useState(false);
const ref = useRef();
useEffect(() => {
const onBodyClick = (event) => {
if (ref.current.contains(event.target)) {
return;
}
setOpen(false);
};
document.body.addEventListener("click", onBodyClick, { capture: true });
return () => {
document.body.removeEventListener("click", onBodyClick, {
capture: true,
});
};
}, []);

我相信唯一导致它重新渲染的是useEffect，我试图删除它并再次运行应用程序，但出现了同样的错误！

Answer 1

我发现问题是在渲染组件时调用setdropDown。所以出现了这个错误。你只是这样更新：

<button onClick={() => setdropDown(!dropDown)}>