state 기반 스타일 변경 (1) 썸네일형 리스트형 [CSS][React] 사용자 상호작용에 따른 UI 변경 피드백을 state와 의사 클래스를 함께 쓸 때 주의점 배경 지식프론트엔드에서는 통상 사용자가 클릭이나 마우스 호버 등의 상호작용을 할 때 ui 스타일이 변경되어 상호작용을 표현한다.이 표현을 구현하기 위해 React를 기준으로 두 가지 방식 중 하나을 사용할 수 있다. 이는 아래와 같다.하나, 의사 클래스를 이용한 style 변경 | css에서는 :hover과 같은 의사 클래스를 이용하여 몇 가지 상호작용에 대해 스타일 분기처리를 할 수 있다.스타일의 on off에 대한 분기처리가 css만으로 간단하게 구현 가능하다.:hover, :active, :focus 처럼 간단한 상호작용만 처리 가능하여 복잡한 이벤트의 처리를 할 수 없다.다른 하나, state를 이용한 style 변경 | react의 useState를 이용하여 className이나 style 속성.. 이전 1 다음