TIL : 프로젝트 6일차

hihyeon_cho·2022년 11월 27일
1

TIL

목록 보기
20/101

게시물 모달로 하나만 띄우기 작업

firestore에 저장되어 있는 게시물의 id값을 불러와서 해당 게시물을 모달로 하나씩 띄우고 싶었지만, 사실상 게시물의 id값을 어떻게 불러와야하는지 의문이 들었다.
리스트로 게시물을 불러들여서 {cmt.id}으로 넣는 건 알았지만, 이게 그 게시물이라는 건 어떻게 조건을 걸어야 할까 고민하다가 거듭된 오류로 오늘도 튜터님을 찾았다...ㅎㅎ

  1. 모달창을 띄우는 버튼에 data-id값으로 {cmt.id}(게시물의 id)를 넣어, 그 값을 아래와 같이 받아온다.
  const commentId = event.target.getAttribute('data-id'); 
  1. .filter()를이용해 cmtObjList에서 위의 commentId와 obj.id가 같은 조건인 게시물을 content라는 변수에 넣는다.
  const content = cmtObjList.filter((obj) => commentId === obj.id); 
  1. content의 [0]번째 값을 object에 넣어서 모달창 temp_html을 제작한다. ( 반환되는 값이 1개일때만 [0]을 사용하기 )
  const object = content[0];

오늘도 이렇게 하나 배워가는 시간이었다.
태그에 id, class 뿐만 아닌 data-id값을 추가할 수 있는것, filter를 이용하여 조건을 만들어 필요한 정보를 추출할 수 있는 방법을 알게되어 유용했던 시간이었다.

프로젝트를 진행하며 직접 부딪혀보니 더 이해가 잘 되는 것 같다.

profile
코딩은 짜릿해 늘 새로워 ✨

0개의 댓글