reactJS [error] - React Hook useEffect has a missing dependency: 'readApplicationForms'. Either include it or remove the dependency array

react에서 함수형 컴포넌트를 사용할 때 life cycle을 useEffect hook을 사용해서 관리한다.

그 중에서 useEffect에 빈 array []를 dependency로 설정해주면 componentDidMount와 같은 역할을 하게 된다.

useEffect(() => {
	readApplicationForms();
},[]);

이 코드는 처음 component들이 mount 되었을 때, readApplicationForms() 함수를 실행한다는 것을 의미한다.

그런데 실행했을 때 다음과 같은 warning을 확인할 수 있다.

만약 componentDidMount를 대신하는 부분이 아니였다면 dependency에 연관된 state 변수를 넣어줬겠지만, 컴포넌트가 마운트 될 때 한 번만 실행하고 싶었기 때문에 다른 해결책이 필요했다.

 

이런 경우 useEffect의 마지막에 // eslint-disable-next-line react-hooks/exhaustive-deps 를 넣어주면 warning 자체를 해결하지는 못하지만, warning을 무시할 수 있다.

 

이런 경우에 어떻게 해결할 수 있을지 더 찾아봐야겠다.

useEffect(() => {
	readApplicationForms();
    // eslint-disable-next-line react-hooks/exhaustive-deps
},[]);