스위치 문에 범위를 조건으로 넣어주기
총갯수에서 비율에 따라 투명도 다르게 바꿔준다.
switch (true) {
case opacity >= 0 && opacity <= 0.2:
color = COLORS.POINT_COLOR_20;
break;
case opacity > 0.2 && opacity <= 0.4:
color = COLORS.POINT_COLOR_40;
break;
case opacity > 0.4 && opacity <= 0.6:
color = COLORS.POINT_COLOR_60;
break;
case opacity > 0.6 && opacity <= 0.8:
color = COLORS.POINT_COLOR_80;
break;
case opacity > 0.6 && opacity <= 1:
color = COLORS.POINT_COLOR_100;
break;
}
https://wakestand.tistory.com/189
자바스크립트 switch 범위 사용방법 예제
자바스크립트에서 switch를 범위로 사용할 경우에는 switch(조건) 을 true로 설정해 준 뒤에 그 안의 case에서 범위를 걸어주면 된다 위 예제에서는 10씩 증가시키면서 10, 20, 30 이하일 때 console.log가 출
wakestand.tistory.com
react - native에서는 display 'none', 'flex'
return문에서 if가 적용되지 않아서 삼항연산자를 중복 이용해주었다.
<View style={{ display: message ? 'none' : 'flex' }}>
{opacity === 0 ? (
<SupportText>아직 하나도 먹지 않았어요!</SupportText>
) : opacity === 1 ? (
<SupportText>축하합니다! 캐치필 달성!</SupportText>
) : (
<SupportText>
와! 벌써 <TakenPill>{isTakenNum}</TakenPill>개나 드셨네요!
</SupportText>
)}
</View>
삼항연산자 중복 사용
삼항연산자 삼항 연산자는 조건식을 가지고 반환할 피연산자를 선택하는 동작을 하기 때문에 조건 연산자라고도 부른다. 이름에서 알 수 있듯 조건식의 결과에 따라 값을 반환하기 때문에, if문
d8040.tistory.com
콘페티 애니메이션 적용
'개발자 되는 중 > TIL&WIL' 카테고리의 다른 글
내배캠 TIL 2023.01.13 (0) | 2023.01.13 |
---|---|
내배캠 TIL 2023.01.12 (0) | 2023.01.12 |
내배캠 TIL 2022.01.10 (0) | 2023.01.10 |
내배캠 TIL 2022.01.09 (0) | 2023.01.08 |
내배캠 TIL 2022.01.08 (0) | 2023.01.06 |