- setRecommended
- Recommed가 될 때마다 Board의 recommend 수가 적용되야 한다. 이를 적용하기 위해
const [recommended, setRecommended] = useState(false);
- recommend 버튼 → onClick
<button onClick={() => handleRecommend(board.board_id)}>Recommend</button>
- handleRecommend()
const handleRecommend = async (board_id: number) => {
try {
await recommendBoard(board_id); // 추천 요청 보내기
setRecommended(true); // 추천 상태 업데이트
} catch (error) {
// 추천 요청 실패 시 에러 처리
console.error('Error recommending board:', error);
}
};
- recommended를 useEffect()에 추가
- recommended 업데이트 마다 recommend 수가 적용된 board를 보여주여야 함
- setRecommended(false)를 추가해 매 추천마다 useEffect가 적용되도록 한다.
useEffect(() => {
const fetchBoards = async (token:string) => {
try {
// API 요청 URL을 적절히 변경하세요.
const response = await getBoardsAxios(token);
setBoards(response); // 'data' 필드 안의 'data' 배열을 상태로 설정
} catch (error) {
console.error('Error fetching boards:', error);
}
};
const accessToken = localStorage.getItem('accessToken');
if (isLoggedIn && accessToken) {
fetchBoards(accessToken); // fetchData는 보드 정보를 불러오는 함수입니다.
} else {
setBoards([])
}
setRecommended(false);
}, [isLoggedIn, recommended]);
Share article