개발새발 로그

React, Express : 댓글 불러오기 본문

MERN

React, Express : 댓글 불러오기

이즈흐 2023. 6. 29. 23:05

댓글을 DB에 저장했으면 이제 댓글을 불러와보자

 

 

RepleList

1. useEffect에서 axios요청을 해 댓글 데이터를 가져온다.

2. 이때 PostArea 컴포넌트에서 props로 가져온 postId로 데이터를 찾을 것이다.

3. 댓글 리스트를 가져오는 axios요청을 작성하고 요청한다.

4. 댓글리스트를 저장하는 배열 state를 선언하고 요청에서 받아오면 저장해준다.

5.그리고 받아온 repleList를 map으로 뿌려준다.

 

server/Router/reple

1. getReple API를 작성해준다.

2. Reple을 클라이언트에서 보내준 postId를 이용해 postId로 저장된 댓글들을 모두 불러온다.

 

📝추가적인 부분

1.댓글을 작성하고 등록하면 새로고침이 되어야 댓글들이 나타나게된다.

 -이를 위해 repleUpload.js에서 작성 후 댓글 등록버튼을 누르고 작성이 성공할 때 window.location.reload()를 수행한다.

2. 로그인을 했을 때만 댓글을 등록할 수 있도록 로그인안했을 때 댓글 작성할 수 있는 컴포넌트를 안보이게 한다.

728x90
반응형
LIST