코딩쌀롱

✱문제1. 체크박스 체크되는 영역 문제 : chakra UI의 Checkbox를 사용해서 선택하는 모달창을 만들었는데, Checkbox만 클릭해야 체크되고 그 외의 MenuItem 요소부분을 클릭하면 모달창이 닫히거나 체크되지 않는 문제 생각 : ui 라이브러리를 사용하지 않고, 직접 짰다면 label을 이용해서 쉽게 해결할 수 있는 문제인데.. 만들어진 걸 가져다 쓰려니까 내가 주는 className이나 data-id값이 어디에 저장되는지 알 수가 없어 많이 헤맸다. 해결 : MenuItem > ItemWrap, Checkbox 구조에서 MenuItem > Checkbox > ItemWrap 구조로 변경 체크박스 자식인 ItemWrap을 클릭해도 체크가 된다. 하지만 라벨 width === 아이템랩 w..

✏️Event Bubbling, Capturing, target 중첩된 요소에서 이벤트가 발생할 때, HTML DOM API의 이벤트 전파(Event Propagation)는 두 가지 방식으로 구분된다. 이 두 가지 방식이 Bubbling, Capturing이다. Bubbling: 이벤트가 발생한 요소부터 window까지 이벤트 전파 (하위 → 상위) Capturing: window로부터 이벤트가 발생한 요소까지 이벤트 전파 (상위 → 하위) 📌 Bubbling 가장 안 쪽의 를 클릭하면 onclick 핸들러 동작 onclick 핸들러 동작 onclick 핸들러 동작 document 객체를 만날 때까지, 각 요소에 할당된 onclick 핸들러 동작 이런 흐름을 이벤트 버블링이라고 부른다. 이벤트가 제일 ..