reactjs - Too many re renders on react

Question

I'm getting this too many re-renders error when I'm running this, this is in react. I ve already searched on many forums but still no luck. I know why this is happening because I ve used setState in useEffect, and is looping.

useEffect(() => {

    getClassData();
  }, []);

  //setClassData(stateData);
  const getClassData = ()=> {
    axios.post(`${apiEndPoint}/get/class/student`, ApiData, {
      headers: headers
    }).then(response => {
      const classArray = response.data;
      stateData=classArray;
      setClassData(classArray);
    })
      .catch(err => {
        console.log(err)
      })

  }
  console.log(stateData);
  return(
    <ClassListGenerator classArrayData={classData}/>
  )
};

question from:https://stackoverflow.com/questions/65952717/too-many-re-renders-on-react

Answer 1

Why do you directly mutate state? Try this in your then block

  const classArray = response.data;
  setClassData(classArray);