How can stop infinite loop in useeffect hook

user_13155432 0
Viewed 261

 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);
      });
  });

I am working on the react js where i have to show the list of user after the page render so i use the useeffect hook what when i write the useeffect hook it call the api infinite time how can stop this. if i add the blank dependencies [] it show requestoptions are missing from dependencies

react-hooks reactjs frontend api javascript
2 Answers

Pass an empty array as a second argument to useEffect Hook.

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

If you would leave the second argument of the Effect Hook empty, you would run into an infinite loop because the Effect Hook always runs after the state has changed. Since the Effect Hook triggers another state change, it will run again and again to increase the count.

user_137344120

You sould pass requestOptions as second argument

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]);
      });
user_116849350
Related