[Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders.

今天做一个vue项目遇到的问题,父组件通过props传了个参数到子组件,在子组件关闭的时候弹出这个错误,我想是因为子组件直接调用了这个参数所以会报错,所以得先保存一下参数。

代码如下:

<action-dialog height="208" :show.sync="show" :maskClose="false" @confirm="onConfirm" @cancel="onCancel" @closed="onClosed" title="窗帘设置">

这里有个:show.sync="",需要用到父组件传过来的值。

props:["modelFlag"],
  data () {
    return {
        show:false,
    }
  }
  //通过watch监听参数,将参数赋值给this.show
  watch:{
      modelFlag:{
        handler(newVal, oldVal) {
        this.show = newVal;
        }
      },
  }

这样问题就解决啦。

原文地址:https://www.cnblogs.com/MrTager/p/12566849.html