댓글 수정

최권준·2021년 9월 30일

댓글수정

  • 댓글을 수정하는데 있어 가장 어렵게 여겼고 동시에 아주 중요하다고 생각 된 것들
    -map과 map안의 내용은 컴포넌트를 분리해서 만들어야한다
    • 기존에는 이런식으로 map과 div가 한 파일안에 같이 있었다.
    • 수정하기를 구현하려면 파일을 import해서 파일자체로 map을 돌려야 한다
  • isEdit과 같은 state를 만들고 수정하기 버튼을 누르면 버튼을 누른 '그 댓글만' isEdit이 true가 되도록 만들어야 한다. 만약 위에서 한것처럼 컴포넌트를 분리하지 않으면 댓글 하나하나의 isEdit을 적용할 수가 없다.

댓글 수정의 기본적인 순서

1. 수정하기 버튼에 onClick 함수를 줘서 isEdit을 true로 바꿔준다
2. 조건부랜더링을 통해 isEdit이 false일때는 댓글을 보여주고 true일때는 댓글작성
   파일을 import해와서 댓글작성창을 띄워준다(댓글작성 UI와 수정UI는 같기때문)
3. 댓글작성하는 파일에 isEdit을 props로 보내주고 댓글작성창에서 isEdit을 받아서 
   true이면 createBoardComment가 아니라 updateBoardComment를 실행시킨다

<내 댓글 폴더 구조>

commentRead가 map안에 있는 댓글 목록들

index.js가 게시물 상세화면 + 댓글목록 map으로 돌려놓은 메인파일

0개의 댓글