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

react-virtualized 를 사용하여 진행 해보려하는데 막히는 점이 있어서 문의 드립니다. ㅜ

react-virtualized 를 적용한 List 의 경우, documentElement.scrollHeight가 아닌 자체 List에서 스크롤이 생기더라구요(전체 화면이 아닌 POSTCARD에서부분 적으로 스크롤이 생기더라구요)  여기서 MainPosts를  LOAD하는데 애를 먹었습니다ㅜㅜ 이 경우에는 

  useEffect(() => {
        function onScroll(){
            if(window.scrollY + document.documentElement.clientHeight > document.documentElement.scrollHeight - 300){ //스크롤을 다 내리면
                if(hasMoreposts&&!loadPostLoading){
                    //console.log('go dispatch');
                    console.log('load_post_request');
                    dispatch({type:LOAD_POST_REQUEST});
                }
            }
        }
        window.addEventListener('scroll',onScroll);
        return()=>{
            window.removeEventListener('scroll',onScroll); //return 으로 이벤트 리스너를 해지 해주지 않으면 메모리에 쌓인다.
        }
    }, [hasMoreposts,loadPostLoading]) //의존 하는 변수를 찾아라!

이 코드로 해선 안될 것 같더라구요!ㅜㅜ

List 자체에서 스크롤 위치를 찾아서

LOAD_POST_REQUEST하는 useEffect를 작성해야하나요 ?

아니면..react-virtualized 에 내장된 infiniteloader이런걸 활용해야하나요 ?