扩展子表单数据传输方式。

src/components/avue-custom-form/avue-custom-form.vue

@@ -20,7 +20,7 @@ export default class AvueCustomForm extends Vue {
   /**
    * 编辑器参数传入组件配置
    *
-   * @type {any}
+   * @type {*}
    * @memberof AvueCustomForm
    */
   @Prop() public options?: any;
@@ -47,7 +47,7 @@ export default class AvueCustomForm extends Vue {
    * @type {any}
    * @memberof AvueCustomForm
    */
-  @Model('change') public value: any;
+  @Model("change") public value: any;
 
   /**
    * 是否将表单数据通过组件配置带入组件中
@@ -57,13 +57,22 @@ export default class AvueCustomForm extends Vue {
    */
   @Prop() public isFormData?: boolean;
 
+  /**
+   * 是否为子表单
+   *
+   * @type {boolean}
+   * @memberof AvueCustomForm
+   */
+  @Prop() public isSubForm?: boolean;
+
   /**
    * 表单数据
    *
-   * @type {any}
+   * @type {*}
    * @memberof AvueCustomForm
    */
-  @Prop() public formData: any;
+  @Prop()
+  public formData: any;
 
   /**
    * 表单状态
@@ -84,6 +93,7 @@ export default class AvueCustomForm extends Vue {
     if (this.value) {
       if (this.isParseString) obj = JSON.parse(this.value);
       else obj = this.value;
+      if (this.isSubForm && obj instanceof Array) obj = this.loadSubFormData(obj);
     }
     return obj;
   }
@@ -110,7 +120,7 @@ export default class AvueCustomForm extends Vue {
   /**
    * 当前组件配置设置属性
    *
-   * @type {any}
+   * @type {*}
    * @memberof AvueCustomForm
    */
   public formOption: any = null;
@@ -118,7 +128,7 @@ export default class AvueCustomForm extends Vue {
   /**
    * avue-form默认配置
    *
-   * @type {any}
+   * @type {*}
    * @memberof AvueCustomForm
    */
   public defaultOptions: any = {
@@ -239,18 +249,46 @@ export default class AvueCustomForm extends Vue {
    * @memberof AvueCustomForm
    */
   public setValue(value: any) {
+    if (this.isSubForm) value = this.getSubFormData(value);
     if (this.isParseString) this.$emit("change", JSON.stringify(value));
     else this.$emit("change", value);
   }
 
+  /**
+   * 提取第一个属性值
+   *
+   * @memberof AvueCustomForm
+   * @return {Array<any>}
+   */
+  public getSubFormData(value: any): Array<any> {
+    let arr: Array<any> = [];
+    for (let val in value) {
+      arr = value[val];
+      break;
+    }
+    return arr;
+  }
+
+  /**
+   * 加载子表单值
+   *
+   * @memberof AvueCustomForm
+   * @return {*}
+   */
+  public loadSubFormData(arr: Array<any>): any {
+    let value: any = {};
+    value[this.formOption.column[0].prop] = arr;
+    return value;
+  }
+
   /**
    * 销毁组件(vue生命周期)
    *
    * @type {Subject<any>}
    * @memberof AvueCustomForm
    */
-  public destroy(){
-    if(this.formStateEvent){
+  public destroy() {
+    if (this.formStateEvent) {
       this.formStateEvent.unsubscribe();
     }
   }