질문입니다.

React로 NodeBird SNS 만들기

6-6. 댓글 작성, 댓글 로딩

작성

안녕하세요 제로초님 이번에도 또 에러때문에 이렇게 질문을 드립니다...죄송..

현재 6-6 댓글 작성,로딩 강의를 진행했는데요, 게시물의 댓글버튼을 누르면

TypeError: mainPosts is undefined

라는 에러창이 뜹니다.
reducer 의 mainPosts에 이상한 값이 들어갔다는 소리같은데.. 일단은 제로초님의 코드와 비교도 해봤구요 redux devtool을 확인해보면 LOAD_COMMENTS_SUCCESS도 확인이 됩니다.

혹시나해서 PostCard.js 에서

  const onToggleComment = useCallback(() => {
    setCommentFormOpened(prev => !prev); 
    if (!commentFormOpened) {
      dispatch({
        type: LOAD_COMMENTS_REQUEST,
        data: post.id,
      });
    }
  }, []);

if (!commentFormOpened) {

dispatch({

type: LOAD_COMMENTS_REQUEST,

data: post.id,

});

}

이 부분을 지우고 다시 진행을 해보면 댓글창은 뜨고, 댓글 추가 시 redux devtool은 ADD_COMMENT_FAILURE를 출력, saga post.js 에서 addComment 에 추가한 consol.error(e); 를 확인해보면

TypeError: "Invalid attempt to spread non-iterable instance"

_nonIterableSpread nonIterableSpread.js:2

_toConsumableArray toConsumableArray.js:5

reducer post.js:106

combination Redux

y (index):1

h (index):1

b (index):1

dispatch Redux

e (index):1

Redux 12

라는 콘솔에러를 출력합니다. 저 에러는

const Comments = [...post.Comments, action.data.comment];

이 부분을 가르키고 있긴한데...

어떤 부분을 다시 확인해봐야 할까요??

https://github.com/ljg0230/nodebird_ljg/tree/hotfix_1

javascript react

답변 6

제로초(조현영)

지식공유자

이 부분은 ...을 할 때 에러가 난 것인데 ...을 하는 대상이 객체나 배열이 아니면 저 에러가 날 겁니다. action.data같은게 undefined인 것 같습니다.

제로초(조현영)

지식공유자

mainPosts에 이상한 값이 들어간 게 아니라, mainPosts가 undefined입니다. mainPosts가 왜 undefined인지를 찾아보셔야겠습니다. mainPosts가 undefined라는 에러가 뜰 때 그 코드 위치를 콘솔창에서 바로 알 수 있습니다. 확인해보세요.