🔥 TIL - Day 13

📌 협업 프로젝트 4일차 구현 이슈

오늘 가장 애먹었던 것은 페이징 부분이다.

팀원들과 간단한 상의를 통해 법안목록 페이징 방법을 정했다.

• 일반적인 페이지 숫자를 제공하는 방법
• 이전, 다음 버튼만 제공하는 방법
• 더보기 버튼만 제공하는 방법
• 무한스크롤

성능상 이슈로 결정했다기 보다는 그냥 보기 좋고 구현하기 쉬운 방향으로 결정했다. 더보기 버튼으로 결정됐고 굉장히 간단하게 해결될 것으로 생각했다...

하하

이번 프로젝트에 사용한 api는 페이징을 위해 두 개 데이터를 제공한다.

왜 그랬던건지 모르겠는데 나는 pIndex에 pSize가 더해지면 다음 페이지라고 이해했다. 일반적인 페이징 쿼리인 offset과 limit으로 생각했던 것이다.

여기서 pIndex는 이것 그대로가 한 개 페이지를 의미한다. pIndex가 1이면 1페이지, 2이면 2페이지 인 것이다. 처음부터 이 사실을 알고 시작했다면 시간낭비는 없었을 텐데...

페이징 주요 로직 (10개씩)

if ((offset+1)*10 >= total_count) {
  g_readmore_button_show = false
}
offset+=1

offset=pIndex
total_count: api로 부터 받은 전체 아이템 수

총 아이템이 15개라면 첫 번째 페이지는 10개 아이템을 뿌리고 두 번째 페이지 (offset=2)에서는 if문에 들어가서 flag 변수로 더보기 버튼을 감춘다. (is-hidden or remove)

검색 조건을 통해 받은 결과에 대한 페이징은 아래와 같이 처리했다.
전역변수를 많이 사용해서 살짝 아쉽지만 뭐.. 잘 됐다 ㅎ

// 현재 검색조건이 의원이름인 경우 더보기 처리
if (g_condition == "name")
  get_law_list_by_proposer_name(g_name)
// 현재 검색조건이 법안이름인 경우 더보기 처리
else if (g_condition == "title") {
  get_law_list_by_title(g_title)
}
// 현재 검색조건이 없는 경우 더보기 처리
else
  get_law_list()

🔎 결 과

큼직큼직한 기능을 거의 다 구현되었고 이제 완성도를 위한 예외처리와 기능에 대한 욕심을 부려볼 차례이다. 필수 기능은 완료 했으니 이제 조금 더 즐겁게 프로젝트를 즐겨보자 ㅎㅎ