• 카테고리

    질문 & 답변

  • 세부 분야

    풀스택

  • 해결 여부

    미해결

LOAD_FOLLOWERS_REQUEST 부분에 대해서 질문드립니다.

20.05.29 11:27 작성 조회수 144

0

현재 reducers/user.js에서

case LOAD_FOLLOWERS_REQUEST: {
            return {
              ...state,
              hasMoreFollower: action.offset ? state.hasMoreFollower : true,  // 처음화면 일때는, offset은 0 이므로, false취급을 받아서 true로 넘어간다.(=더보기 버튼을 보여준다.)                                                         
                                                                              // (처음화면일때 offset이 0인것은, router.get('/:id/followers'... 에서 확인가능)       
            };
        }

위와같이

hasMoreFollower: action.offset ? state.hasMoreFollower : true

부분을 적어주셨는데, 이 부분이 잘 이해가 가질 않아서 질문드립니다.

코드 뜻이 이해가 안가는게 아니라,  이 부분이 존재해야하는 이유를 잘 모르겠어서 질문드려요.ㅠ

제 생각에는

case LOAD_FOLLOWERS_SUCCESS: {
            return {
              ...state,
              followerList: state.followerList.concat(action.data), // 기존것을 덮어쓰지 말고, 기존것에 추가 
              hasMoreFollower: action.data.length === 3,            // 방금 로드된 팔로워가 1명 또는 2명이라면, 더보기 버튼을 보여줄 필요가 없다.
                                                                    // 방금 로드된 팔로워가 3명일때만, 더보기 버튼을 보여줄 필요가 있다.
            };
        }

위 처럼 LOAD_FOLLOWERS_SUCCESS부분에 

hasMoreFollower: action.data.length === 3,

이 부분만 있어도 된다고 생각을 하는데,,

그 이유는..

■첫번째이유

의미상으로도 팔로워가 로드됐을때, 3명이 로드되면(=limit을 3으로 설정했었음), LOAD REQUEST후에, LOAD SUCCESS 부분으로 가서...

hasMoreFollower: action.data.length === 3,

이 부분이 true가 될거고, 더보기 버튼이 생길것입니다.

(1명이나 2명이 action.data에 담겨오면, 더보기 버튼이 생기지 않을것입니다.)

따라서 저는 이부분만 있어도 충분하다고 생각을 했습니다..

.

■두번째 이유

처음 프로필 화면에 들어갔을때, redux DevTools를 보면, 

LOAD_FOLLOWINGS_REQUEST,

LOAD_FOLLOWERS_REQUEST,

LOAD_FOLLOWINGS_SUCCESS,

LOAD_FOLLOWERS_SUCCESS,

이렇게 4개의 액션이 일어나는것을 확인할 수 있는데요.

이처럼, 처음화면역시 request->success로 바로 이동을 하는데, 그렇다면, 굳이 왜 LOAD_FOLLOWERS_REQUEST쪽에 

hasMoreFollower: action.offset ? state.hasMoreFollower : true,

를 넣어줘야 하는지 잘 이해가 안갑니다.

.

그래서 LOAD_FOLLOWERS_REQUEST쪽에 해당 구문을 주석을 처리한 후, 실행시켜봤습니다.

case LOAD_FOLLOWERS_REQUEST: {
            return {
              ...state,
              //hasMoreFollower: action.offset ? state.hasMoreFollower : true,  // 처음화면 일때는, offset은 0 이므로, false취급을 받아서 true로 넘어간다.(=더보기 버튼을 보여준다.)                                                         
                                                                              // (처음화면일때 offset이 0인것은, router.get('/:id/followers'... 에서 확인가능)       
            };
        }

이처럼 주석을 처리하고 프로필 화면을 들어가도 주석을 하지않았을때와 같은 결과가 나왔습니다.

제가 아직 리액트를 배운지 얼마 안되서 잘 몰라서 이런생각을 하는것일 수도 있을것 같습니다.

.

요약하자면, 굳이 LOAD_FOLLOWER_REQUEST부분에 저 부분을 넣어주신 이유가 궁금합니다!

course-thumbnail

React로 NodeBird SNS 만들기

7-7. 더보기 버튼

강의실 바로가기

답변 2

·

답변을 작성해보세요.

1

조현영님의 프로필

조현영

지식공유자

2020.05.29

LOAD_FOLLOWINGS_REQUEST랑 LOAD_FOLLOWERS_REQUEST가 없어야 하는게 맞네요. 처음부터 사람 목록을 불러오는 게 아니라 버튼을 눌렀을 때 첫 로딩을 하는 걸 의도한 것이었습니다.

0

pym7857님의 프로필

pym7857

질문자

2020.05.29

넵. 항상 빠른 답변 감사드립니다~

이 글과 비슷한 Q&A