v-on:change event for radio input VueJS

Question

I have a problem with event listener for input radio.

HTML:

<input
  type="radio"
  id="flat"
  name="property_type"
  class="switch-input"
  v-model="registerData.propertyType"
  value="flat"
  checked
/>

And when I add v-on="change:foo" into input element, the page crash loading on that input radio.

Code:

var companyList = new Vue({
    el: '#companyList',
    cache: false,
    data: {
        disabledTime: {
            to: new Date()
        },
        registerData: {
            serviceCategoryId: '{{ $serviceCategoryId }}'
        }
    },
    methods: {
        foo: function() {
            console.log('aaa');
        }
    },
})

What is the best way to call function on change event?

Answer 1

Assuming you're using vuejs 2, your syntax is incorrect, this is actually vuejs 1 syntax.

v-on:change="foo" is the correct syntax, check the docs for more details.