React, Express : 댓글 수정 기능

이제 댓글을 수정하는 기능을 추가해보자

 

필요한 기능

1. 댓글 수정 버튼을 누르면 댓글을 수정하는 컴포넌트를 띄워야함

 -EditFlag라는 state를 선언해서 수정버튼을 누르면 댓글 수정 컴포넌트를 보여줌

 

-수정버튼을 누르면 EditFlag가 true가 되고 수정 컴포넌트가 띄워짐

-setModalFlag로 모달폼은 닫아줌

-댓글 수정 컴포넌트에 취소버튼을 추가해서 취소를누르면 다시 EditFlag를 false로 만들어줌

2. 댓글 수정을 눌렀을 때 이전 댓글의 데이터를 가져와야함

-Reple이라는 state의 초기값을 빈문자열이 아니라 props로 넘겨준 이전 댓글데이터로 설정해준다.

3. 댓글 수정 버튼을 눌렀을 때 /edit 이라는 API로 서버에 업데이트 요청을 해야한다.

-서버에 업데이트 요청할 때 보내줄 데이터로 아래와 같은 데이터가 필요하다.

-user.uid는 어차피 작성자 본인만 댓글 수정이 가능하니까 props.reple.uid가 아닌 리덕스의 user.uid도 가능하다.

-repleId라는 reple의 ObjectId 값도 보내줘야한다

-이유는 유저의 uid로 서버에서 find를 하게되면 다수의 댓글이 나올 수 있으므로 특정 댓글 하나만 찾을 수 있는 _id 값을 줘야한다.

-/edit API 요청

4.server/Router/reple.js

-클라이언트에서 edit요청을 보내면 받아줄 API를 작성한다.

-업데이트할 데이터를 설정해준다.

-클라이언트에서 보내준 reple의 ObjectId로 데이터를 찾고 미리 설정해준 temp 데이터로 덮어씌워준다.