vue子组件数据影响父组件数据的问题

Question

### 问题描述
第一次在社区提问题，如有不妥，还请包涵。

在项目中遇到的一个问题。可能涉及到element-ui。现在有主组件m，子组件c，el-table组件t和el-form组件f。

我将回传到m的数据展示在t中，又以slot的形式通过data传给c，将c的数据展现到f中（就是一个修改功能）。本身是个很简单的逻辑，可我发现在我修改f的数据的时候，m的表格数据也会跟着改变，这实在是蒙了圈，说实话完全没有解决思路。

### 问题出现的环境背景及自己尝试过哪些方法
总之先试着排除了一下全局数据的问题。该项目是没有用到任何全局数据的，也没用到vuex。试了下把.sync换了个变量修饰，没被修饰到的变量并没有发生这种情况。

### 相关代码

主组件：

<el-table :data="tableData">
<el-table-column type="selection" width="55"></el-table-column>
<el-table-column prop="id" label="id"></el-table-column>
<el-table-column prop="code" label="容器编号"></el-table-column>
<el-table-column prop="warehouseCode" label="仓库编码"></el-table-column>
...
<el-table-column label="操作">
 <template slot-scope="scope">
 <el-button size="mini"
 type="text"
 icon="el-icon-edit"
 @click="handleUpdate(scope.row)"
 >编辑
 </el-button>
 ...
 <itemCRUDDialog :show.sync="diaOpen" :title="title"
 :switch="switch1" :diaForm="diaForm"
 :containerType="containerType" />
 ...
 handleUpdate(row) {
  this.diaForm = row
  this.switch1 = true
 this.title = '修改容器'
 this.diaOpen = true
}

子组件：

<el-dialog
 :title="title"
 :visible.sync="visible"
 width="700px"
 append-to-body
 @close="$emit('update:show', false)"
>
 <el-form ref="diaForm" :title="title" :model="diaForm" :rules="rules" label-width="100px">
 <el-row :gutter="20">
 <el-col :span="12">
 <el-form-item label="增加数量(个)" prop="quantity">
 <el-input v-model="diaForm.quantity" placeholder="请选择增加数量(个)">
 </el-input>
 </el-form-item> 
 </el-col>
 </el-row>
 </el-form>
 ...
 <script>
 export default{
    name: 'itemCRUDDialog',
 props:{
      show:{
        type:Boolean,
 default:false
 },
 switch:{
        type:Boolean,
 default:false
 },
 diaForm: {
        type:Object,
 default:{}
      },
 title: {
        type:String,
 default:''
 },
 containerType:{
        type:Array,
 default:[]
      }
    },
 watch:{
      show(){
        this.visible = this.show
 if (!this.switch){
          this.diaForm = {}
        }
      }
    },
 data() {
      return {
        visible: this.show
        title:''
 }
}
}

Answer 1

因为你修改的和主组件里的是同一个对象
JSON.stringify再parse一下再传
或者传的时候{...diaForm}
还有你子组件watch里直接修改了props的diaform没报错么。。
还有一个如果想props默认值为{} 得写成()=>({}) 顺便说下数组写()=>[] 对象加括号是应为不加就是一个空的函数了