이벤트버블링3 React가 이벤트를 관리하는 방식 - 3 (완) https://rbals0445.tistory.com/139 React가 이벤트를 관리하는 방식 - 2 https://rbals0445.tistory.com/138 React가 이벤트를 관리하는 방식 - 1 올해가 가기 전 리액트를 소스코드 레벨에서 분석해보는게 목표였습니다. 목표를 간단하게 잡고 분석을 해보자 했지만, 생각보다 모 rbals0445.tistory.com 지난 글에서 이벤트 발생시에 등록했던 이벤트 핸들러가 어떻게 작동하는지 알아봤습니다. 코드 분석을 하면서 얻게된 내용들을 최종적으로 정리할 예정입니다. 리액트에서 이벤트 버블링을 사용하면 안되는 이유? 약 반년전에 회사 소스코드에다가 이벤트 버블링으로 함수를 작성한적이 있었습니다. 당시에 작성하고나서 효율적으로 작성했군.. 하면서 PR.. 2023. 6. 19. React가 이벤트를 관리하는 방식 - 2 https://rbals0445.tistory.com/138 React가 이벤트를 관리하는 방식 - 1 올해가 가기 전 리액트를 소스코드 레벨에서 분석해보는게 목표였습니다. 목표를 간단하게 잡고 분석을 해보자 했지만, 생각보다 모르는게 너무 많더라구요. ㅎㅎ 거의 2~3주 동안 시간이 나면 rbals0445.tistory.com React에서 사전에 어떻게 native event와 매핑이 되고, 실제로 등륵은 어떻게 이루어지는지 알아보았습니다. 이번 글에서는 어떻게 이벤트가 실행되는지 알아보겠습니다. 화면에 모든 컴포넌트들이 렌더링 되고, 특정 엘리먼트를 클릭하면 이벤트는 어떻게 실행 될까요?? 이벤트 실행시키기 item 1 을 클릭해서 'click' event를 발생시킨 경우를 예로 들어보겠습니다. 코.. 2023. 6. 18. React가 이벤트를 관리하는 방식 - 1 올해가 가기 전 리액트를 소스코드 레벨에서 분석해보는게 목표였습니다. 목표를 간단하게 잡고 분석을 해보자 했지만, 생각보다 모르는게 너무 많더라구요. ㅎㅎ 거의 2~3주 동안 시간이 나면 계속 틈틈히 찾아봤던것 같습니다. 첫번째 주제는 React에서 이벤트를 어떻게 관리하는지에 대해서 자세하게 알아보겠습니다. 이 글을 읽고나면 아래 내용들을 코드로 직접 확인할 수 있습니다. (10개가 넘는데 다 쓰진 않겠습니다) - 리액트에서 이벤트 버블링을 사용하지 않아도 되는 이유 - 리액트의 이벤트는 document가 아닌 rootElement에 등록된다는 사실 - 리액트에서 어떻게 이벤트 버블링을 통해 이벤트를 처리하는지? - 어떻게 특정 함수만 찾아서 영리하게 실행하는지? - onClick 함수를 onClick.. 2023. 6. 15. 이전 1 다음 728x90
