[Vuejs]-Vue2: Avoid mutating a prop directly inside component

by

3👍

✅

You’re getting that warning because you are binding persons to the input in the template via v-model. Changing the input’s value will thus change the value of persons, which means the prop is getting mutated directly in your sr-el component.

You should set a new property equal to persons and pass that to v-model instead:

Vue.component('sr-el', {
  template: '#srx',
  props: ['persons'],
  data: function() {
    return {
      inputVal: this.persons,
    }
  }
})

<input v-model="inputVal" ... />
👤thanksd

Leave a comment