На этапе сортировки во vue выкидывает ошибку Avoid mutating a prop directly

<template>
  <select v-model="modelValue" @change="changeOptions">

    <option disabled>Выбурите из списка</option>
    <option v-for = "option in options" v-bind:key="option.value" :value="option.value">{{option.name}}</option>
  </select>

</template>

<script>
export default {
  name: "my-select",

  props:{
    modelValue: {
      type: String,


    },
    options:{
      type: Array,
      default: ()=> []
    },

  },    
  methods:{
    changeOptions(event) {    
      this.$emit("modelValue", event.target.value)        
    }
  }
}        
</script>

<style scoped>   
</style>

Текст ошибки:

Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being mutated: "modelValue"


Ответы (1 шт):

Автор решения: Виктор Карев

https://ru.vuejs.org/v2/guide/components-custom-events.html Добавьте опцию model.

model: {
    prop: 'modelValue',
    event: 'change'
}
→ Ссылка