UI/React
[ React / useState ] 다중 팝업 제어하기 열기(Feat.)
Soo_Parkle
2024. 8. 1. 10:00
보통은 CSS클레스로도 display none 처리하여 popup을 처리하기곤 한다.
이번엔 useState를 사용하여 처리를 해보려고 했다.
situtation : 한 페이지에서 일자와 사람이 같이 팝업으로 열림.
Task : 한 페이지에서 1개 이상의 팝업이 열리는 것 방지
action
1) CSS => display : none
2) useState => boolean or number
2)을 선택하여 진행 => 이유 1) 속도 측면에서 큰 차이가 없다. 누가 먼저 동일 페이지에서 로드 했냐가 차이를 .1 만들뿐 2) 1)보다는 코스 수가 간결하다 특히 CSS
Result
1. 한개만 띄게 완료
2. 바탕화면(?) 클릭 시 팝업 닫기 완료