[TIL] 무한 스크롤

[TIL] 무한 스크롤

날짜

• 2022.06.30.

목표

• 없음

내용

React - 무한 스크롤

• Scroll Event

  • 브라우저 크기와 스크롤 위치에 따라 스크롤

    const { innerHeight } = window; // 브라우저창 내용의 크기 (스크롤을 포함하지 않음)
    const { scrollHeight } = document.body; // 브라우저 총 내용의 크기 (스크롤을 포함한다)
    const { scrollTop } = document.documentElement; // 현재 스크롤바의 위치
    
    // scrollTop과 innerHeight를 더한 값이 scrollHeight보다 크다면
    if (Math.round(scrollTop + innerHeight) >= scrollHeight) {
    

결론

• 완벽한 무한 스크롤 방식이 아닌 것 같다. 더 최적화된 방법을 찾아보자!