What does @input="$emit('input', $event)" means in vue component?

Question

I am reading some code that I want to update:

<b-input :value="value" @input="$emit('input', $event)" ref="input" :maxlength="maxlength"/>

what does @input="$emit('input', $event)" stand for? Where and how can I listen for the input event?

Answer 1

@input is the short-hand for v-on:input which binds to the component's input event. vm.$emit is documented here and has an example with a similar use-case here.

In your case your component simply emits an event with the same name and the same arguments as the one it receives from its child b-input. Programatically you can listen to these events with vm.$on, e.g. in your mounted method:

export default {
  components: { BInput },

  mounted () {
    this.$on('input', (event) => {
      console.log(event);
    });
  }
}