[英]How can stop infinite loop in useeffect hook
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 钩子,当我编写 useeffect 钩子时,它会无限次调用 api 如何阻止它。 如果我添加空白依赖项 [] 它显示依赖项中缺少 requestoptions
将一个空数组作为第二个参数传递给 useEffect Hook。
useEffect( ()=>{
console.log(‘hello’);
}, [] );
如果将 Effect Hook 的第二个参数留空,则会陷入无限循环,因为 Effect Hook 总是在状态更改后运行。 由于 Effect Hook 会触发另一个状态更改,它会一次又一次地运行以增加计数。
你应该通过requestOptions作为第二个参数
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);
}, [requestOptions]);
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.