이벤트 2

vue3 부모->자식 자식->부모 데이터 전달방법

부모에서 자식으로 데이터 전달부모 컴포넌트에서 자식 컴포넌트로 데이터를 전달하기 위해 props를 사용합니다.ParentComponent.vue ChildComponent.vue 자식에서 부모로 데이터 전달자식 컴포넌트에서 부모 컴포넌트로 데이터를 전달하기 위해 emit을 사용합니다.ChildComponent.vue Send Message to ParentParentComponent.vue {{ childMessage }} 위 예제에서는 부모 컴포넌트에서 자식 컴포넌트로 메시지를 props를 통해 전달하고, 자식 컴포넌트에서 부모 컴포넌트로 메시지를 emit을 통해 전달합니다. props와 emit을 함께 사용하여 부모와 자식 컴포넌트 간의 데이터를 효과적으로 주고받을 수..

프로그래밍/Js 2024.08.12

[vue3] emitter.on 이벤트 사용시 emitter 갯수가 증가하는 이유

원본 코드const loadChartDatahandler = data=>{ // to do};onUnmounted(()=>{ emitter.off('loadChartData', loadChartDatahandler) }):onMounted(()=>{ emitter.on('loadChartData', data=>{ loadChartDatahandler(data); })}); Vue 3에서 이벤트 리스너를 등록하고 해제하는 과정에서 loadChartData 배열의 길이가 계속 늘어난다면, 이는 이벤트 리스너가 제대로 제거되지 않았기 때문일 가능성이 큽니다. 이 문제를 해결하려면 이벤트 리스너를 등록할 때 사용하는 함수 참조를 일관되게 유지해야 합니다.문제는 onMoun..

프로그래밍/vue 2024.06.11