2021년 06월 28일 TIL

오늘은 무한 스크롤 & 로딩 스피너를 구현했다.

  const infiniteScroll = async () => {
    let scrollHeight = Math.max(
      document.documentElement.scrollHeight,
      document.body.scrollHeight
    );
    let scrollTop = Math.max(
      document.documentElement.scrollTop,
      document.body.scrollTop
    );
    let clientHeight = document.documentElement.clientHeight;

    if (scrollTop + clientHeight === scrollHeight) {
      runInAction(() => {
        shoeStore.pageNo += 1;
      });
      // alert("스크롤 끝!");
      setLoading(true);
      await shoeStore.getShoesList("bearer " + sessionStorage.getItem("token"));
      setLoading(false);
    }
  };

구현 내용은 이러하다. 로딩 스피너는 모달창으로 구현하였다.