[FE] refactor: 리뷰 목록 페이지에서 isLastPage가 true일 때, IntersectionObserver 해제 #737
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Closed
2 tasks
soosoo22
changed the title
BadaHertz52
reviewed
Sep 26, 2024
| @@ -9,7 +9,7 @@ const useGetReviewList = () => { | |||
| queryFn: ({ pageParam }) => | |||
| getReviewListApi({ | |||
| lastReviewId: pageParam === 0 ? null : pageParam, // 첫 api 요청 시, null 값 보내기 | |||
| size: pageParam === 0 ? 10 : 5, // 첫 api 요청 시, 10개의 리뷰를 불러오고 그 이후로는 5개씩 불러온다. | |||
| size: 10, | |||
There was a problem hiding this comment.
중간에 정책이 바꼈는데 아직 공지가 안 됐던 상황이라고 들었어요
There was a problem hiding this comment.
넵넵 에프이 말이 맞아요🙂 중간에 바뀌었는데 공지가 안 되었어요.. 다들 바쁘다 보니까😭
There was a problem hiding this comment.
추가로 받아오는 리뷰 개수가 10개 미만이어도 오류는 없는건가요?
There was a problem hiding this comment.
일단 목 데이터 개수 조절해서 해봤는데 오류는 없네요..
ImxYJL
reviewed
Sep 26, 2024
| @@ -9,7 +9,7 @@ const useGetReviewList = () => { | |||
| queryFn: ({ pageParam }) => | |||
| getReviewListApi({ | |||
| lastReviewId: pageParam === 0 ? null : pageParam, // 첫 api 요청 시, null 값 보내기 | |||
| size: pageParam === 0 ? 10 : 5, // 첫 api 요청 시, 10개의 리뷰를 불러오고 그 이후로는 5개씩 불러온다. | |||
| size: 10, | |||
BadaHertz52
reviewed
Sep 26, 2024
| @@ -2,6 +2,11 @@ import styled from '@emotion/styled'; | |||
|
|
|||
| import media from '@/utils/media'; | |||
|
|
|||
| export const AnswerListModalContent = styled.div` | |||
| width: 100%; | |||
| overflow-x: hidden; | |||
There was a problem hiding this comment.
stylint 적용하면 overflow-x가 width 위에 있어야해요
ImxYJL
approved these changes
Sep 26, 2024
BadaHertz52
approved these changes
Sep 26, 2024
nayonsoso
pushed a commit
that referenced
this pull request
Sep 26, 2024
…해제 (#737) * refactor: 가로 스크롤을 숨기기 위해 AnswerListModalContent 추가 * refactor: ReviewList 인터페이스에 isLastPage 추가 * refactor: isLastPage가 true일 때, IntersectionObserver 해제 * refactor: 리뷰 요청 개수 size를 10으로 수정 * refactor: 목 데이터 응답에 isLastPage 값 추가 * chore: stylelint 적용
donghoony
deleted the
fe/design/736-hide-horizontal-scroll-confirmation-modal
branch
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
🚀 어떤 기능을 구현했나요 ?
🔥 어떻게 해결했나요 ?
리뷰 목록 페이지에서 상세 페이지로 이동한 후 다시 목록 페이지로 돌아올 때, 동일한 리뷰가 중복으로 추가되는 오류가 있었습니다. 모든 리뷰를 다 받았음에도 불구하고 마지막 리뷰에 IntersectionObserver가 계속 달려서 발생한 문제로 파악됩니다.
이를 해결하기 위해 서버에서 isLastPage 값을 함께 보내주도록 수정했습니다. isLastPage가 true일 경우, 더 이상 추가적인 데이터를 불러오지 않도록 IntersectionObserver를 해제했습니다. 그리고 리뷰 요청 개수 size 디폴트값이 5가 아닌 10으로 변경되었습니다!!
문제 상황
2024-09-26.11.23.42.mov
작성 내용 확인 모달 가로 스크롤 숨기기
AnswerListContainer를감싸는
AnswerListModalContent를 추가해서overflow-x: hidden을 주었습니다.📝 어떤 부분에 집중해서 리뷰해야 할까요?
📚 참고 자료, 할 말