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>
))}
'⛵ 항해99 > TIL · WIL ✏️' 카테고리의 다른 글
[TIL] 2023.10.13 - Vite와 CRA (0) | 2023.10.13 |
---|---|
[TIL] 2023.10.12 - Tailwind CSS(하단바 고정하기) (0) | 2023.10.12 |
[TIL] 2023.10.10 - Vite 환경변수 설정(.env) (0) | 2023.10.10 |
[TIL] 2023.10.09 - axiosInstance / interceptors (0) | 2023.10.10 |
[TIL] 2023.10.07 - useLocation() : 페이지 이동 시 데이터 전달 (0) | 2023.10.10 |