스크롤시 데이터 불러오기

안녕하세요.

스크롤이 바닥에 닿으면 데이터를 불러오는 홈페이지를 구현해보고있습니다.

3개씩 받아오는 건데  처음 랜더링 되었을 때 114 줄에있는 console.log에서 3이 출력되고,

스크롤이 끝까지 가면 데이터가 3개가 추가로 불러오지기는 하는데 108줄 console.log에서 3이 출력됩니다.

setItem으로 데이터가 총 6개가 불러져 화면에도 출력되는데 왜 console.log에 또 6이 출력되는지 모르겠습니다. 

지금은 처음 한번만 실행되게 해두었는데,

useEffect에 조건을 주어 스크롤이 바닥에 닿을때마다 무제한으로 계속 실행되어 데이터가 추가되어야 할 것 같은데, 어떤 조건을 주어야할지도 감이 안잡힙니다. 

감사합니다.