SoFunction
Updated on 2025-04-05

Solve the problem of errors in the props value transmitted by the vue child component to modify the parent component

vue does not recommend directly modifying the props value transmitted by the parent component in the child component, it will report an error

[Vue warn]: 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: "result" (found in component )

 <input v-model="currentSearch" type="text" class="input-search" @="doSearch">
export default {
  name:"round-search-bar",
  props:['search'],  //The value passed by the parent component  data(){
    return {
      currentSearch:   //Define the new variable currentSearch through data. In this way, when the value of currentSearch is changed, the search value transmitted from the parent component will not be affected.    }
  },
  methods: {
    doSearch(){
      (this.$router,)
    }
  },
}

The above article solves the problem of errors in the props value transmitted by the parent component of vue child component modification is all the content I share with you. I hope it can give you a reference and I hope you can support me more.