Vue.js에서는 데이터는 부모에서 자식으로 내려주고, 이벤트는 자식에서 부모로 올려주는 형태가 일반적이다.

부모 컴포넌트에서 이벤트가 발생했을때, 자식 컴포넌트에서 이를 감지하게 하려고 한다. 시행착오를 겪은 과정을 정리한다.

시도해본 방법

1. 부모컴포넌트의 함수 바인딩 @event.native=”functionName” (실패)
2. 부모컴포넌트의 함수를 자식컴포넌트에서$listener 로 읽어들이기 (실패)
3. 부모컴포넌트에서 자식 컴포넌트의 함수 호출 : this.$refs.child_component.childComponentFunction (성공)
4. eventBus : 새로운 vue instance생성해 이벤트 주고 받기 (성공)