공부내용 한줄 요약
두 개의 State와 삼항연산자 사용해 disabled "flip" 기능 추가
State의 초기값을 false로 두고, 두 개의 컴포넌트에게 disabled 속성을 주되 각각 값이 false면 활성화 / true면 활성화 되게 한다.
disabled={flipped} 또는 disabled={flipped === false} / disabled={!flipped} 또는 disabled={flipped === true}
("flip"버튼에 onClick 이벤트 리스너를 통해 실행되게 해놓은) State의 함수는 function((current) => !current), 즉 current를 사용하지 직접 true/false 적지 않아 오류를 방지한다.
삼항연산자 Boolean(?) ? (참일 때의 변수) : (거짓일 때의 변수)
Comment
VanillaJs와 달리 ReactJs는 {} 안에 갑자기 조건문을 적는 것이 익숙하지 않다. 이에 더해 삼항연산자의 활용법이 명확하지 않다.
State값을 boolean으로 쓰면 야간모드 개발에 사용하기 좋아보인다.