array.from2 Array.from 이용해서 새로운 배열로 별점 생성하기 삼항연산자로 후기가 없을 경우 처리하기 이번 포스팅에서는 유저에게 이미 적힌 리뷰들을 볼 수 있는 리뷰 리스트를 구현해보도록 하자. 먼저 후기가 하나도 없는 유저라면 배열로 오는 데이터의 길이가 0일 것이기 때문에 그에 해당하면 후기가 없다는 것을 삼항연산자를 통해 보여주었다. {reviewData.length === 0 ? ( 아직 후기가 없습니다. ) : ( 후기 있는 경우 ) } new Array로 숫자를 별점 아이콘으로 만들기 후기가 있는 경우 백엔드에게 받아오는 후기의 평점는 양의 정수였는데 이 데이터를 별 아이콘으로 보여지도록 가공해야했다. 방법을 찾는 중에 멘토님께서 new Array()라는 것을 알려주셨고, new Array(숫자)를 넣어주면 숫자만큼의 길이를 가진 배열을 생성할 수 있었다.. 2023. 9. 24. custom hook 제작해 리뷰 점수를 별점으로 만들기 이번 프로젝트에서 기능을 좀 더 고도화를 해볼까 하고 도전한 것이 별점이다. 처음에는 그냥 숫자로 나타내려고 하다가 아이콘도 써보고 싶고 별점을 구현해보고 싶어서 고민을 하다가 도전을 해보았다. 사실 그냥 숫자보다 별모양이 더 이쁘니까 ㅎㅎ //custom hook 및 style이라고 적혀있는 코드 외에는 모두 별점이 있는 컴포넌트에서 작업했다. 아이콘 선택 svg를 쓸지 뭘 쓸지 고민을 하다가 폰트어썸을 쓰기로 결정을 했고 그 중 fastar, solid를 기본으로 진행하였다. 사실 초기엔 빈 별에서 꽉 찬 별로 진행하고 싶었는데 두개를 import 해오는게 안돼서 꽉찬별의 색을 바꿔주기로 했다. import { FontAwesomeIcon } from '@fortawesome/react-fontawe.. 2023. 8. 23. 이전 1 다음