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

작성자 없음

작성자 정보가 삭제된 글입니다.

[리뉴얼] React로 NodeBird SNS 만들기

게시글 불러오기

궁금합니다!

작성

·

164

0

만약 페이지네이션이라면 어떻게 할지 궁금해서 여쭤봅니다. 물론 구글링도 해보고 혼자만든 플젝에서 더미데이터 등을 이용해서 페이지네이션은 해봤지만 제가 원하는 부분을 정확히 못 찾은 것 같기도 하고, 페이지네이션을 이용해서 서버와 연동은 안해봐서 궁금합니다!

먼저 게시판이라고 예를 든다면 서버와 연동할 때 1|2|3|4|5 이런 페이지가 만약에 있다면 1페이지를 누르면1-10까지의 글을 보여주고, 2페이지를 누르면 11-20까지를 보여준다면,  페이지 번호와 limit을 서버에 보내주고 받은 게시글 데이터들을 배열에 저장해서 보여주는 식으로 가는 것이 맞을까요 ?

또 궁금한 점이 노드버드에서는 스크롤링을 해서 concat으로 추가를 해주는 형식인데, 페이지네이션에서는 concat 처럼 추가가 되는 것이 아닌 페이지 번호 클릭 혹은 next,prev 버튼 클릭시 마다 보여주는 목록이 다르기 때문에 클릭시 마다 서버에서 받아온 값으로 초기화를 시켜주는 것이 맞을까요 ?

답변 1

0

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

페이지번호와 리밋 방식이 가장 간단한 방법입니다. 다만 페이지 뒤로 갈수록 성능 문제가 생겨 보통 커서와 리밋 방식을 많이 씁니다. 커서는 페이지 첫 게시글의 아이디라고 보시면 됩니다.

페이지이기때문에 이전 글들을 초기화하고 그 자리에 데이터를 불러오면 됩니다.

아 제가 여쭤본게 가장 간단한 방법이였군요!

늦은 시간에 한가지만 더 여쭙겠습니다 ㅜ

제로초님이 말씀하신 커서 방식에서의 아이디란 첫 게시글의 아이디라고 말씀하셨는데, 페이지네이션을 하면 누른 번호의 페이지의 번호에 따라 가져오는 데이터들이 달라지는데,

스크롤의 경우 lastid는 맨 마지막 id를 가져오기 때문에 이 아이디의 다음부터 가져오면 되지만 페이지네이션에서는 1페이지를 눌렀다가 5페이지로 갈수도있는데 그렇다면 

처음 리스트들이 있는 페이지를 들어갔을 때 

(1페이지)커서가 없기 때문에 맨 첫 데이터부터 limit 까지의 데이터를 받아와 보여주고, 커서를 1페이지의 첫 데이터의 id등으로 지정하고,

그후 만약 5페이지를 눌렀다면 커서를

커서 = 커서 + ((클릭한페이지번호 - 이전페이지번호)*limit);

음 이런식으로 하는 것이 맞을까요 ? 대답 확인 후 곰곰히 생각해봤는데 이런식,,으로 생각이 들어서요 아니면 커서를 들고 오는다른 방식이 있을까요..?

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

네 맞습니다. 그렇게 다음커서를 찾아야합니다.

감사합니다 기능을 생각해볼 수 있는 계기였습니다 !!!

 

작성자 없음

작성자 정보가 삭제된 글입니다.

질문하기