티스토리

Junvely 개발일기
검색하기

블로그 홈

Junvely 개발일기

junvelee.tistory.com/m

프론트엔드 개발

구독자
1
방명록 방문하기

주요 글 목록

  • [React] 페이지네이션(Pagenation) 구현하기 - 코드리뷰와 리팩토링 🙌 페이지네이션 코드 리뷰 받은 부분 리팩토링 지난 번 페이지네이션을 구현한 부분에 대해 FE팀원 분께서 코드리뷰를 해주셨다. 12월은 여러 일정 때문에 바빠서 늦었지만 지금이라도 복습 겸 정리해보려 한다. 페이지네이션 기능 구현 부분에서 몇가지 🐛가 있었고, 언급해 주신 부분을 참고하여 리팩토링 하였다. 리팩토링 후에 FE팀원 분이 더 간결한 코드로 리팩토링 해주신 부분도 추가하였다. 지난 번에 구현한 페이지네이션 코드는 다음과 같다. import React, { useMemo } from 'react'; import styles from './Pagenation.module.scss'; interface IPagenationProps { maxPage: number; currentPage: numbe.. 공감수 0 댓글수 0 2022. 12. 28.
  • [React] 페이지네이션(Pagenation) 구현하기 🙌구현 목표 : 페이지네이션 구현하기 다음과 같은 페이지 네이션을 구현하여야 한다. 즉, 1~10까지 페이지 가 보여지고 페이지 단위는 10씩 넘겨진다. ◀ 클릭 시 이전 페이지 => 현재 페이지가 11~20일 경우 => 1페이지로 이동 ▶ 클릭 시 다음 페이지로 넘어간다. => 현재 페이지가 11~20일 경우 => 21페이지로 이동 First는 첫 페이지로 Last는 마지막 페이지로 이동한다. 1. Pagenation 컴포넌트에 maxPage(최대 페이지), currentPage(현재 페이지), setCurrentPage, visiblePageCount(페이지 단위)를 넘겨준다. export const HomePage = () => { const [pagenation, setPagenation] = u.. 공감수 0 댓글수 0 2022. 12. 3.
    728x90
    반응형
    문의안내
    • 티스토리
    • 로그인
    • 고객센터

    티스토리는 카카오에서 사랑을 담아 만듭니다.

    © Kakao Corp.