아래와 같이 따로 ts파일을 만들어서 %를 구하는 함수를 구현했다.
regularPrice: 정상가
discountedPrice: 할인된 가격
percent를 구한후 Math.floor를 통해 소수점자리는 제외한다.
export default function calculatePercent(
regularPrice: number,
discountedPrice: number
) {
const discount = regularPrice - discountedPrice; //정상가에서 할인된금액을 빼서 얼만큼 할인되었는지 금액을 구한다.
const percent = (discount / regularPrice) * 100; //toFixed:소수점자리제외/할인된금액의 %구하기/.toFixed(0) 는 소수점을 반올림해서 안되고 아래 Math.floor로 진행
return Math.floor(percent);
}
다른 파일에서 map을 통해 값을 얻어올 때 위 함수에 인자를 넣어 사용했다.
..
{calculatePercent(item.price, item.discountPrice)}%
'React' 카테고리의 다른 글
[React] lottie-react 사용법 (lottie 애니메이션) (0) | 2023.07.31 |
---|---|
[React] 남은 시간 타이머 구현 (feat:day.js) (0) | 2023.07.28 |
[React] 쿠키 저장하기 (react-cookie/서브 도메인 달라도 쿠키 공유) (0) | 2023.07.27 |
[React] 숫자 세자리마다 , 콤마 붙이기 (0) | 2023.07.26 |
[React] 캘린더 react-datepicker 라이브러리 사용법 (0) | 2023.07.17 |