⛵ 항해99/TIL · WIL ✏️

[TIL] 2023.10.11 - onClick으로 URL(Endpoint)에 Id값 전달하기

hhhhy 2023. 10. 11. 23:39

 onClick으로 URL(Endpoint)에 Id값 전달하기 

  • onClick 핸들러에 화살표 함수를 사용하여 item.postId를 oncilckLikePostHandler 함수로 전달
  • navigate 함수에서 해당 postId를 URL(Endpoint)에 삽입
  • 각 목록 항목을 클릭할 때 해당 포스트의 postId가 전달되고, postId를 UR(Endpoint)에서 사용 가능!
const oncilckLikePostHandler = (postId) => {
  navigate(`/api/posts/${postId}`);
};

// ...

{likeList &&
  likeList.map((item) => (
    <div
      key={item.postId}
      onClick={() => oncilckLikePostHandler(item.postId)}
      className="mx-4 scr"
    >
      {/* 내용 */}
    </div>
  ))}