인프런 커뮤니티 질문&답변

안녕하세요.

useEffect()는 종속성 배열에 있는 값이 바뀌면 다시 호출이 되게 됩니다.

그래서 현재 useEffect안에서 fetchMovieData 함수를 호출하는데

이 함수는 fetchUrl이 달라질 수 있습니다.

그래서 만약 이 값이 달라지면 한 번 더 useEffect가 호출돼서 fetchMovieData가 호출되어야 합니다.

하지만 우리가 만드는 앱에서는 fetchUrl이 하드 코딩된 값이라 변할 리가 없습니다.

그래도 이 경고 문구를 없애주려면

종속성 배열에 함수와 fetchUrl을 넣어주시면 됩니다.

  useEffect(() => {
    fetchMovieData();
  }, [fetchMovieData, fetchUrl]);

아니면 useCallback을 이용해주셔도 됩니다.

  const fetchMovieData = fetchMovieData(async () => {
    const request = await axios.get(fetchUrl);
    console.log("request", request);
    setMovies(request.data.results);
  },[fetchUrl]);

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

이런 식으로요!
감사합니다.