[어? 이게 되네?? 팀] 일일회고
오늘 한 일
이슈 (오피스 아워 질문)
추천데이터를 클릭하면 주소 변화는 생기는데, 페이지 변동이 없는 오류
- useEffect dependency에 id를 추가해주면 바로 렌더링이 이루어진다! dependency를 주의할 것..!
- 코드 예시
useEffect(() => {
fetchBoardgameDetail();
setIsFetchCompleted(true);
}, [boardgameId]);
디테일 페이지 레이아웃 고정
- height를 100vh가 아니라 auto로 준 후, min-height를 100vh로 준다. 그러면 더이상 이미지가 움직이지 않는다. 또한 이미지는 img태그 보다 div태그의 백그라운드 이미지로 넣는다.
게시판 보드의 정렬 고정
map 안에서 async

- map함수 안에서는 async는 실행하면 오류가 생김. promise all 등을 사용.
map 쓸 때 주의할 점
- 오류 메세지가 {id, user_name, content...} 등 객체로 이루어진 데이터를 map으로 돌리는 것이 문제가 되었다. 사실 내가 map을 돌리는 것은 [...]로 이루어진 배열이었는데, 이 배열 안에 있는 객체가 문제가 되었다고 생각한다. 그래서 props를 쪼개서 자식 컴포넌트로 보내서 해결하였다.
setState를 props로 넘기는 것
- 자제하자! setState를 보내주는 것이 아니라, clickHandler같은 함수를 보내서 동작하게 하는 것이 좀더 좋은 코드의 방식이다. 또한 여기서 post요청을 하는 api 통신과 같은 경우 주의해야할 점이, 그 다음 줄에 함수를 실행하는 것이 아닌 .then을 이용하여 비동기 요청이 이루어진 후 바로 다음 함수가 실행되도록 만들어주자!
함수가 존재하는 지 한번 검증 후 실행 하는 버릇
- 중요함! 현업에서도 자주 쓰는 방식인데, 예를 들어
clickHandler
라는 함수가 있다고 가정했을 때, 이 함수를 그냥 실행시키는 것이 아닌,
if (typeof clickHandler === function) {
clickHandler()
}
위와 같은 코드 방식이다.
내일 할 일