$emit is not properly triggering root method - vue.js

Question

I'm just learning vue and am having trouble with an $emit. Here's my code, with some extraneous testing clutter.
The console.log from the component is working, and the Vue console tool shows an event is happening. My root element doesn't seem to be catching the emit.
I expect a click on the input radio to call a component method changeCustomer, which then fires this.$emit('change-customer');, which I expect the root element to catch with v-on:change-customer="changeCustomer" or #change-customer="changeCustomer2 (two attempts), and then I have a console.log in each of those methods, but neither are logging.
I'm guessing it's something small, but any help is appreciated!
html:
<div id="customer-lookup"
v-on:change-customer="changeCustomer">
<label for="customer-lookup-input">Customer lookup</label>
<input type="search"
name="customer-lookup-input"
id="customer-lookup-input"
#keyUp="search"
v-model="customerLookupInput"
#change-customer="changeCustomer2"
/>
<customer-result :results="results"></customer-result>
</div>
js:
Vue.component('customer-result', {
props: {
results: {
type: Array,
required: false,
}
},
// language=Vue
template: `
<ul>
<li v-for="result in results" :key="result.id" class="customer-result">
<input type="radio"
:value="result.pk"
name="selected-customer"
v-model="customerRadio"
#change="changeCustomer"
/>
<span class="customer-name">{{ result.name }}</span>
<span class="customer-address_1" v-if="result.address_1">{{ result.address_1}}</span>
<span class="customer-address_2" v-if="result.address_2">{{ result.address_2}}</span>
<span class="customer-address_3" v-if="result.address_3">{{ result.address_3}}</span>
<span class="customer-city" v-if="result.city">{{ result.city}}, </span>
<span class="customer-state" v-if="result.state">{{ result.state}}</span>
<span class="customer-country" v-if="result.country">{{ result.country}}</span>
<span class="customer-email" v-if="result.email">{{ result.email}}</span>
<span class="customer-phone" v-if="result.phone">{{ result.phone}}</span>
</li>
</ul>
`,
data(){
return {
customerRadio: null
}
},
methods: {
changeCustomer(){
console.log('component change customer');
this.$emit('change-customer');
}
}
});
var app = new Vue({
delimiters: ['[[', ']]'], // django
el: '#customer-lookup',
methods: {
search(e){
if( this.customerLookupInput === "" ){
this.results = null;
} else {
searchCustomers(this.customerLookupInput, this); // ajax call that's working
}
},
updateResults(results){
this.results = results; // update from ajax that's working
},
changeCustomer(){
console.log('root change customer')
},
changeCustomer2(){
console.log('root2 change customer');
}
},
data() {
return {
customerLookupInput: null,
results: null,
customerRadio: null
}
}
});