[TIL] 20.12.05

HyeRyun·2020년 12월 5일
0

TIL

목록 보기
26/48

🧐 님 오늘 뭐함?

리액트 토이프로젝트 '알바비를 계산해줘'

  • 주휴수당 적용 알고리즘
  1. ExtraPay.jsx 파일에 button 2개 생성
  2. 두 버튼 초기 속성 모두 disabled
  3. props로 전달받은 timeResult 값이 15 이상일 경우, 두 버튼 모두 enable 상태로 변경
  4. 주휴수당 '포함' 버튼 클릭시 albaCalc.jsx의 주휴수당 state 변경
  5. 위에서 계산된 주휴수당 값을 최종 월급인 result 에 더함

일단 이 정도로 순서를 생각해보았다.
근데... 막상 구현해보니 이럴 필요가 없었다;;;

// ExtraPay.jsx
const enabled = time >= 15;

// return() 부분..
<button disabled={!enabled} />

요렇게 boolean 값으로 버튼을 쓸지말지 결정해주면 되는 거였다.
그 다음 과정으로 주휴수당 버튼이 활성화되면 onClick에서 주휴수당을 계산하고 최종 월급에 더해줬다.

주휴수당 계산 결과 화면을 찍었는데.. 여기는 동영상이 안 올라가네 ㅠㅠ 아쉽..

✍️ 앞으로의 계획

  • 결과값을 천 단위로 잘라서 콤마 찍어주기
  • 세금 적용
  • 주휴수당 적용
  • bootstrap 적용(reactstrap)
  • 결과값 계산 버튼 클릭하면 이펙트 추가
  • 레이아웃 배치
  • 최저시급 값 가져오기

✨ 느낀점

하나하나 기능이 개발될 때마다 뿌듯함을 느낀다.
Happy Coding !!!

profile
개발개발

0개의 댓글