前端软件开发在vue2解决父子组件报错: 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:

在使用vue2开发过程中，把ElementTiptap富文本编辑器二次封装成组件使用，传值和使用都正常，但是他输入时候报错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:错误。

原因:据说是vue2.x之后移除组件的props的双向绑定功能，如果需要双向绑定需要自己来实现。

解决问题:把v-model="content"的content不要和prop对应起来，如果需要双向绑定，就通过新增变量如initContent，通过watch让initContent之间content进行双向绑定，如果不需要双向绑定只是初始化时候，传值过去就行，直接新增就行。

JAVASCRIPT部分代码如下

  props: {
    initContent: { // 父组件传递过来值-富文本内容
      type: String
    }
  },
  data() {
    return {
      content: this.initContent
    }
  }

对应的html部分代码如下:

    <el-tiptap
      v-model="initContent"
      placeholder="请输入内容"
      lang="zh">
    </el-tiptap>

了念博客

vue2解决父子组件报错: 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: