inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

[리뉴얼] React로 NodeBird SNS 만들기

immer 도입하기

ADD_COMMENT_SUCCESS 새로운 post에서만 작동 안 하는 문제

해결된 질문

492

신영 유

작성한 질문수 14

0

안녕하세요 제로초 님,

redux saga immer, faker 까지만 들었구요, 백엔드는 안 만들었고요.

faker가 문제가 있다길래,

import { faker } from '@faker-js/faker';

이거를 대신해서 설치해서 했는데, 이거의 문제는 아닌거 같고요.

 

ADD_COMMENT_SUCCESS가

기존의 post에서는 작동을 하는데,

새로운 post에서만 작동 안 하는 문제가 있습니다. Screenshot 2023-02-01 at 12.06.04 AM.pngScreenshot 2023-02-01 at 12.08.50 AM.pngScreenshot 2023-02-01 at 12.06.15 AM.png

새로운 post.id가 동작을 안 하나 싶어

const post = draft.mainPosts.find((post)=> {
  console.log(post.id == action.data.postId);
  return post.id == action.data.postId;
});

를 해봤는데 역시 true가 나옵니다.

Screenshot 2023-02-01 at 12.08.19 AM.png

아래는 브라우저 결과 사진들 입니다.

로그인 안 했을 때,

Screenshot 2023-02-01 at 12.13.21 AM.png

로그인 하고 기존의 post에 comment를 달았을 때 -> 정상적으로 동작 함.

Screenshot 2023-02-01 at 12.07.40 AM.pngScreenshot 2023-02-01 at 12.07.48 AM.png

로그인 하고 새로운 post을 하나 추가 -> 정상적으로 동작 함.

Screenshot 2023-02-01 at 12.07.57 AM.pngusername이 바뀌는 건 faker를 썼고, userId만 그래도 컴포넌트에서 받아서 써서 지금 ADD_POST_TO_ME 동작해서 1에서 2로 바뀌었구요.

그러나

새로운 post에 comment를 달았을 때 -> 콘솔로그가 true가 나옴에도 동작을 하지 않음.

Screenshot 2023-02-01 at 12.08.06 AM.png

기존의 post에도 comment가 안 달리는 거면 제가 실수를 한게 분명한데, 새로운 post에만 동작을 안 하는게 이상합니다.

ADD_COMMENT_REQUEST를 보냈을 때에도, 갑자기 mainPosts가 초기화 되거나 그런 것도 아니었습니다. 만약 그랬다면 콘솔로그가 false가 나왔어야 합니다.

Screenshot 2023-02-01 at 12.17.51 AM.png

감사합니다!

express node.js redux nodejs react next.js Next.js

답변 6

0

신영 유

해결 될 거 같습니다 너무 감사합니다!!

0

신영 유

case ADD_COMMENT_SUCCESS:
  const post = draft.mainPosts.find((post)=> {
    console.log(post.id == action.data.postId);
    return post.id == action.data.postId;
  });
  post.Comments.unshift(action.data);
  draft.addCommentLoading = false;
  draft.addCommentDone = true;
  break;

여기에서 콘솔이 true가 뜨는데

draft.mainPosts.find((post)=>post.id == action.data.postId);

이부분 return 값을 콘솔로 찍어왔더니

Screenshot 2023-02-01 at 12.41.43 AM.png이렇게 콘솔에 뜨는데, {...}이부분은 클릭이 안되네요

 

 

 

0

제로초(조현영)

새 게시글 push 하실 때 Comments: []는 안 넣으신 듯 하네요. 그래야 여기에 댓글을 넣을 수 있습니다.

0

신영 유

Screenshot 2023-02-01 at 12.34.24 AM.png헉 죄송합니다!

근데 그래도 별 게 안 뜨네요

0

제로초(조현영)

매우 중요한 게 떴습니다. unshift 앞에 배열이 undefined라는 것이요.

0

제로초(조현영)

저기에 에러 위치까지 다 뜹니다.

0

신영 유

Screenshot 2023-02-01 at 12.29.20 AM.png

0

제로초(조현영)

addPost말고 addComment입니다.

0

신영 유

이미 ADD_COMMENT_SUCCESS로 넘어갔기 때문에

reducer에서 console.log(post.id == action.data.postId);가 true가 나온 것 같습니다.

catch부분에서, console.error(err)을 해봤는데

콘솔에 찍히지 않습니다.

Screenshot 2023-02-01 at 12.30.13 AM.png

0

제로초(조현영)

지금 여기에 에러가 발생하고 있는 부분을 말씀드리는 것입니다. 101번째 줄에서 에러 난다고 되어 있습니다.

0

제로초(조현영)

saga addComment에서

console.error(err.response.data) 대신 console.error(err)만 해서 에러 확인하세요.

넥스트 버젼 질문

0

78

2

로그인시 401 Unauthorized 오류가 뜹니다

0

89

1

무한 스크롤 중 스크롤 튐 현상

0

175

1

특정 페이지 접근을 막고 싶을 때

0

103

2

createGlobalStyle의 위치와 영향범위

0

96

2

인라인 스타일 리렌더링 관련

0

91

2

vsc 에서 npm init 설치시 오류

0

146

2

nextjs 15버전 사용 가능할까요?

0

158

1

화면 새로고침 문의

0

121

1

RTK에서 draft, state 차이가 있나요?

0

153

2

Next 14 사용해도 될까요?

0

452

1

next, node 버전 / 폴더 구조 질문 드립니다.

0

349

1

url 오류 질문있습니다

0

211

1

ssh xxxxx로 우분투에 들어가려니까 port 22: Connection timed out

0

373

1

sudo certbot --nginx 에러

0

1275

2

Minified React error 콘솔에러 (hydrate)

0

470

1

카카오 공유했을 때 이전에 작성했던 글이 나오는 버그

0

247

1

프론트서버 배포 후 EADDRINUSE에러 발생

0

327

1

npm run build 에러

0

518

1

front 서버 npm run build 중에 발생한 에러들

0

382

1

서버 실행하고 브라우저로 들어갔을때 404에러

0

338

2

css 서버사이드 랜더링이 적용되지 않아서 문의 드립니다.

0

288

1

팔로워 3명씩 불러오고 데이터 합쳐주는걸로 바꾸고 서버요청을 무한으로하고있습니다.

0

239

2

해시태그 검색에서 throttle에 관해 질문있습니다.

0

201

1