Javascript 如何处理Vue.js中数据中多层JSON的设置值

以下是我的Vue组件childEle的

数据
中的一个表单：

data:{
  form:{
    root1:Number,
    root2:{
      child1:[],
      child2:{},
      child3:String
    },
    root3:[],
    root4:{
      child4:string,
      child5:[]
    }
  }
}

它是一个非常复杂的JSON对象。由于它是用
iView
中的
表单
提交的，所以似乎不可能展平这个
JSON对象
。现在，我需要在打开此组件后设置此表单的值（事实上，它是一个
模式
），因此我通过
道具
从父元素传输值：

props:{
  outForm:{
    type:Object,
    default: function () {
      return {}
    }
  }
  ……
}

并向其添加属性
watch
：

watch:{
  outForm(val){
    this.form = val
  }
}

现在出现了一个问题。我还绑定了一个
值
属性来控制是否显示
模式
，但是当我将值转移到
值
属性时，
数据
中的
值
没有改变，它无法关闭
模式
，即使我调用了
this.$forceUpdate（）
。
如何处理？谢谢你的帮助
 显示或隐藏模态的控件不需要保留在模态组件中

一个选项是将模式设置为始终处于活动状态，并在父级内部使用v-if条件对其进行控制，例如在名为
showmodel
的变量中

因此，当用户执行显示模态的操作时，父级设置为true，另一方面，模态发出关闭事件（
this.$emit（'close'）
），在父级内部捕获（
），并将
showmodel
设置为false

但是如果你真的需要把这个变量放到表单中，也许会有帮助