修改avue-custom-form组件数据传递方式为双向绑定

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

 <template>
   <div v-if="formOption!=null" class="app-custom-form">
-    <avue-form :option="formOption" v-model="formvalue"></avue-form>
+    <avue-form :option="formOption" v-model="formVal"></avue-form>
   </div>
 </template>
 
@@ -15,7 +15,7 @@ import {
 } from "vue-property-decorator";
 
 import { Subject, Subscription } from "rxjs";
-import axios from 'axios';
+import axios from "axios";
 @Component({})
 export default class AvueCustomForm extends Vue {
   /**
@@ -24,8 +24,7 @@ export default class AvueCustomForm extends Vue {
    * @type {any}
    * @memberof AvueCustomForm
    */
-  @Prop()
-  public options?: any;
+  @Prop() public options?: any;
 
   /**
    * 是否需要转换为string类型
@@ -33,8 +32,7 @@ export default class AvueCustomForm extends Vue {
    * @type {boolean}
    * @memberof AvueCustomForm
    */
-  @Prop()
-  public isParseString?: boolean;
+  @Prop() public isParseString?: boolean;
 
   /**
    * 远端地址
@@ -50,7 +48,7 @@ export default class AvueCustomForm extends Vue {
    * @type {any}
    * @memberof AvueCustomForm
    */
-  @Prop() public value: any;
+  @Model('change') public value: any;
 
   /**
    * 是否将表单数据通过组件配置带入组件中
@@ -60,25 +58,6 @@ export default class AvueCustomForm extends Vue {
    */
   @Prop() public isFormData?: boolean;
 
-  /**
-   * 监听事件
-   *
-   * @param {*} newVal
-   * @param {*} oldVal
-   * @memberof AvueCustomForm
-   */
-  @Watch("value")
-  public onValueChange(newVal: any, oldVal: any) {
-    if (newVal) {
-      let obj: any = {};
-      if (newVal && newVal != null) {
-        if (this.isParseString) obj = JSON.parse(newVal);
-        else obj = newVal;
-      }
-      if (obj) this.formvalue = JSON.parse(JSON.stringify(obj));
-    }
-  }
-
   /**
    * 表单数据
    *
@@ -96,6 +75,31 @@ export default class AvueCustomForm extends Vue {
    */
   @Prop() public formState!: Subject<any>;
 
+  /**
+   * 获取组件值
+   *
+   * @return {any}
+   * @memberof AvueCustomForm
+   */
+  get formVal() {
+    let obj: any = {};
+      if (this.value) {
+        if (this.isParseString) obj = JSON.parse(this.value);
+        else obj = this.value;
+      }
+    return obj;
+  }
+
+  /**
+   * 设置组件值
+   *
+   * @param value
+   * @memberof AvueCustomForm
+   */
+  set formVal(value: any) {
+    this.setValue(value);
+  }
+
   /**
    * 视图状态事件
    *
@@ -113,14 +117,6 @@ export default class AvueCustomForm extends Vue {
    */
   public formOption: any = null;
 
-  /**
-   * avue-form绑定值
-   *
-   * @type {any}
-   * @memberof AvueCustomForm
-   */
-  public formvalue: any = {};
-
   /**
    * avue-form默认配置
    *
@@ -177,9 +173,9 @@ export default class AvueCustomForm extends Vue {
    *
    * @memberof AvueCustomForm
    */
-  public created(){
+  public created() {
     const win: any = window;
-    win.axios=axios;
+    win.axios = axios;
     Vue.use(win.AVUE);
   }
 
@@ -209,9 +205,7 @@ export default class AvueCustomForm extends Vue {
         const get: Promise<any> = this.$http.get(this.url);
         get.then((response: any) => {
           if (response && response.data && response.data.view_config) {
-            that.formOption = JSON.parse(response.data.view_config)[
-              "formConfig"
-            ];
+            that.formOption = JSON.parse(response.data);
             if (this.isFormData) that.getFormData();
           }
         });
@@ -233,7 +227,7 @@ export default class AvueCustomForm extends Vue {
   public getFormData() {
     let that: any = this;
     let obj: any;
-    if (this.value) obj = JSON.parse(JSON.stringify(this.value));
+    if (this.formVal) obj = JSON.parse(JSON.stringify(this.formVal));
     else obj = {};
     let recursionOption: any = function (group: any) {
       group.column.forEach((gItem: any) => {