좋아요 표시 하기

컴포넌트

부모 컴포넌트 (상세 페이지)

자식 컴포넌트 ( 좋아요 버튼)

 

1. 부모 컴포넌트의 고유 id를 자식 컴포넌트로 전달

2. 자식 컴포넌트는 고유 id를 기준으로 데이터를 입력 또는 수정

 

부모에서 자식한테 전달 하는 props
<CommunityLike id={item.id} likes={likeList} />

 

//전달 받은 고유 id
const handleLike = (id: number) => {
    //새롭게 입력 될 데이터
    const requestBody = {
      mainid: numId,
      id: id,
      uuid: dataUid.uid,
      like: true,
    };

// 전달 받은 데이터 리스트에서 해당 조건에 맞는지 비교
    const userLike = likes?.find((item) => {
      if (item.uuid === dataUid.uid) {
        setMainId(item.id);
        return true;
      }
      return false;
    });

// 조건에 맞게 데이터 입력 또는 수정
    if (userLike) {
      const requestBodyEdit = {
        mainid: mainId,
        uuid: dataUid.uid,
        like: false,
      };

      try {
        fetch("/api/community-like-update", {
          method: "PUT",
          body: JSON.stringify(requestBodyEdit),
        });
      } catch (error) {
        console.log(error);
      }
    } else {
      console.log(111111111);
      try {
        fetch("/api/community-like", {
          method: "POST",
          body: JSON.stringify(requestBody),
        });
      } catch (error) {
        console.log(error);
      }
    }
  };

 

주의 해야 할 부분

1. 자식이 전달 받은 고유아디가 부모의 고유 아이디 인지 확인 할 것

2. 자식도 고유 아이디를 생성 할때 수파베이스 비교문에서 잘 전달 받는지 확인 할 것