Vue.js - Emit event from child to parent

I am not able to $emit an event from a child component to it's parent. I can successfully send the event, but not receive it in the parent.

Results.vue (Child):

<a href="#" v-on:click="sendResultValues"></a>

// 

methods: {
    sendResultValues: function () {
        this.$emit('send-result-values', 'carrier');
    }
},

When I click on the <a>, I can see with Vue DevTools that an $emit event is fired:

However, nothing is received in the console.log as my code below (parent):

Input.vue (Parent):

<search-results></search-results> //Results.vue component
<search-popover v-on:send-result-values="showResultData"></search-popover>
 //
methods: {
    showResultData: function () {
        console.log("Data received from child: ")
    }
 },

You need to listen to the event on the search-results component, not on the search-popover.

Input.vue (Parent):

<search-results v-on:send-result-values="showResultData"></search-results>
<search-popover></search-popover>

methods: {
    showResultData: function () {
        console.log("Data received from child: ")
    }
 },