• 카테고리

    질문 & 답변
  • 세부 분야

    풀스택

  • 해결 여부

    미해결

최적화 예제 진행 도중 궁금증이 생겨 질문드립니다.

20.06.01 19:43 작성 조회수 191

0

지금까지 강의를 급하게 따라 가느라 제 코드를 점검해볼 시간이 많이 없었는데요. 이번 최적화 예제 강의를 들으며 천천히 다시 코드도 뜯어보고 기능도 확인하던 도중 이상한 점을 발견했습니다.

질문은 크게 두가지 입니다.

■질문1)

/* 팔로우 하기 눌렀을때 */
  const onFollow = useCallback(userId => () => {
    //console.log(me.id, userId);   // 12, 1
    dispatch({
      type: FOLLOW_USER_REQUEST,
      data: userId,
    });
  }, []);

바로 이부분에서 useCallback의 두번째 인자가 []로 비어있는 상태인데, 매개변수로 들어온 userId를 []에 넣어주지 않았었던 이유가 궁금합니다. 강의 들을 당시에는 별 생각없이 넘어갔었는데, 다시 살펴보다보니 userId를 []에 넣어주지 않는 이유가 궁금해져서 질문을 드립니다. 원래 매개변수로 들어온 변수는 []에 넣어주지 않는것인가요?

.

■질문2)

현재 팔로우를 누르고 곧바로 언팔로우를 하게되면, 새로고침을 해야만 글자가 바껴지는 문제가 발생합니다.. (다시말하자면, 팔로우를 누르면 화면상으로는 [언팔로우]라고 뜨고, 곧바로 [언팔로우]라는 글자를 누르면 아무일도 일어나지 않습니다.) 

프로필 페이지에서 확인해보면 팔로잉 목록에도 잘 들어가있고,   F12의 Network탭에서 요청과 응답도 다 제대로 되고있습니다.

하지만, 앞서 말씀드렸듯이 팔로우를 한뒤 곧바로 언팔로우를 하면 글자가 바뀌지도 않고, 이후로 모든 기능들이 비정상작동합니다..요청도 제대로 되지 않구요..

지금까지 이렇게 페이지가 곧바로 바뀌지 않는 경우는 useCallback의 두번째 인자에 값을 안넣어줘서 일어났었던 오류였던걸로 기억을 하는데요. 어떤 이유에서 이렇게 안되는 것일까요 ? ㅠㅠㅠ 아무리 고쳐봐도 답을 못찾겠어서 질문드립니다. (또한 프로필 페이지에서 팔로잉 목록에 있는 유저를 삭재할때도 역시 새로고침을 해야만 적용이 됩니다. ㅠ)

혹시몰라서 깃허브 주소도 같이 남기겠습니다.

(깃허브 주소: https://github.com/pym7857/react-nodebird)

답변 2

·

답변을 작성해보세요.

1

1. useCallback의 인수는 userId => () => {}, 와 [] 두 개입니다. 둘이 다른 인수이므로 []에서 userId는 당연히 사용할 수 없습니다(스코프가 다릅니다)

2.언팔로우할 때 redux에서 팔로잉하고 있던 아이디가 빠지나요? UNFOLLOW_SUCCESS부분 리듀서가 구현이 이상한 것 아닐까요?

0

pym7857님의 프로필

pym7857

질문자

2020.06.02

감사합니다 제로초님. 제가 지금까지 me.Followings와 followingList를 굉장히 헷갈려하고 있어서 이런 오타를 범한것 같습니다.

제로초님 말씀대로 리듀서에서 me.followingList라고 해놨었네요.. 이 계기로 코드를 뜯어보고 나서야 이제야 둘의 차이가 명확해졌습니다. 감사합니다~