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

sunarol님의 프로필 이미지
sunarol

작성한 질문수

코드로 배우는 React with 스프링부트 API서버

조회 페이지 이동

챕터 3 임의로 URL에 size 값을 변경한 후 다른 페이지로 이동하면 size가 기본값 10으로 돌아갑니다.

작성

·

301

0

안녕하세요 강사님 강의 수강중인 학생입니다.

 

일단 코드는 강의 내용이나 올려주신 부분하고 다른 점은 없는 것 같은데 원래 이렇게 되는 것인가요?

 

page=1&size=1을 주면 글 하나씩 페이지가 생기는데 그 상태에서 페이지 번호 버튼을 눌러서 다른 페이지로 이동하면

 

size 파라미터 값이 기본값 10으로 돌아가네요

 

localhost:3000/todo/list?page=1&size=1

인 상태에서

 

페이지 번호 2번 버튼을 눌러서 이동하면

localhost:3000/todo/list?page=2&size=1

이렇게 되어야 하는 것 아닌가요?

localhost:3000/todo/list?page=2&size=10

이렇게 되어버립니다.

 

코드를 계속 살펴보고 동작 방식을 생각해보니

 

클라이언트 쪽 코드상에서 page와 size값이 변하는 것을 받아변수에 저장하는 부분은 페이지 번호 버튼을 눌렀을때 useCustomMove의 size 변수와 sizeNum 변수인데

 

버튼을 통한 변화없이 임의로 URL에서 size를 바꾸고 페이지 번호 버튼을 누르면 저장된 size값은 10 그대로이기 때문에 그렇게 되는 것이 아닐까라는 추측을 해봅니다.

 

size는 변동을 딱히 고려하지 않는 파라미터일 수도 있는데 여러가지로 궁금해져서 이런저런 시도를 해보다보니 의문이 생겼었네요.

 

실제로 웹개발을 할때 페이지를 나누는 경우 한 페이지의 size값은 변동이 없는 파라미터인가요? 기준을 정하기 위함인가요?

답변 1

0

구멍가게코딩단님의 프로필 이미지
구멍가게코딩단
지식공유자

hooks에 있는 useCustomMove 코드에는

 


const page = getNum(queryParams.get('page'), 1)
const size = getNum(queryParams.get('size'), 10)

와 같은 코드를 작성해 두었는데요.. 이것은 page의 값을 음수로 주거나 한 페이지의 size가 너무 작은 경우에 기본값을 지정합니다.

 

때문에 size=1로 지정해도 10으로 처리됩니다.

 

size값은 리스트의 성격에 따라 기본값을 20,50 등과 기준값을 이용하는 경우가 더 많습니다만 동작하는 방식을 알면 간단한 것이라 적용해 둔 것입니다.

sunarol님의 프로필 이미지
sunarol

작성한 질문수

질문하기