表单嵌套表单涉及的校验和数据回显

props中接收父组件的传值

data中定义表单的初始值,不能写成空对象,会报错

在created中对编辑的情况进行赋值,注意不能直接赋值,数据不是响应式的,需要使用到this.$set

props:{
  formData:{
   type:Object,
   default:()=>{}
 }
}

data(){
  formDataList:{
   name:"",
   age:"",
   hobby:{
    swim:"",
    play:""
   }
 }
}

created(){
//区分编辑的情况下,对表单进行赋值
//注意不能直接用...进行赋值,v-model就不是响应式的了
//需要使用到this.$set

this.$set(this.formDataList,'name',this.formData.name);
this.$set(this.formDataList,'age',this.formData.age);
this.$set(this.formDataList.hobby,'swim',this.formData.swim);
this.$set(this.formDataList.hobby,'play',this.formData.play);
}