안녕하세요! 현재 코드에서 문제가 발생하는 이유는 useEffect에서 무한 루프가 발생하기 때문입니다. useEffect의 두번째 매개변수로 의존성 배열(dependency array)을 입력하

안녕하세요! 현재 코드에서 문제가 발생하는 이유는 useEffect에서 무한 루프가 발생하기 때문입니다. useEffect의 두번째 매개변수로 의존성 배열(dependency array)을 입력하지 않았기 때문입니다. 이 경우, useEffect는 컴포넌트가 렌더링될 때마다 실행되며, getBannerData 함수가 호출됩니다. 그리고 setBannerData 함수가 호출되어 상태가 변경되고, 다시 컴포넌트가 렌더링되며 무한 루프가 발생합니다. useEffect에 빈 배열을 입력하면, 컴포넌트가 처음 렌더링될 때 getBannerData 함수가 호출되고, 그 이후로는 실행되지 않습니다. 이렇게 코드를 수정하면 됩니다. 또한, setBannerData(result); 코드는 필요하지 않습니다. response.data.result를 바로 setBannerData 함수로 전달하여 상태를 업데이트하면 됩니다. 마지막으로, imgUrls 대신 src를 사용하여 이미지를 불러오는 것이 맞습니다. 다음은 수정된 코드입니다.