React 인피니티 스크롤 구현하기(인터넷 전체화면X) (임의의 작은 페이지 화면)

    const scrollHandler = useCallback((e) => {
      console.log(e.target.scrollHeight + '스크롤헤잍');
      console.log(e.target.clientHeight + '클라리언트헤잍');
      console.log(e.target.scrollTop + '스크롤 탑')
      if(e.target.clientHeight + e.target.scrollTop + 15 > e.target.scrollHeight) {
        if(InfinityScroll && !loadPostsLoading) {
          dispatch({
            type : LOAD_POSTS_REQUEST,
            lastId : PostsData[PostsData.length - 1]?.id
          })
        }
      }
  },[InfinityScroll, PostsData, loadPostsLoading])

이런식으로 하면 접근 가능하다!

처음 화면에 5개의 게시글만 나타나게 되면,

스크롤을 살짝 내렸을 때, 다른 포스트 5개가 추가로 로드 되고,
Document의 ScrollHeight가 787 -> 1302 로 늘어나게 된다,

이런식의 그림이 완성된다..