Vue 2.0 instance is not hearing events emitted by vue-router components

Question

I am using Vue 2.0-rc.6 (latest at the moment) and Vue-router 2.0-rc.5 (latest at the moment).

I tried to do this.$emit('custom-event') in one of my router components, and this.$on('custom-event', () => { console.log('I heard an event') }) in my Vue instance but the event was not being listened. The router component itself was hearing the event but not the Vue instance.

Any idea?

Check out this jsfiddle.

Answer 1

An event from $emit is not propagated to the parent instance. The parent has to listen for it on the component in the template actively.

<router-view @eventname="callbackMethod" />