解决外部改变地区选择的v-model值地区选择内部没有刷新问题

examples/components/index.vue

@@ -11,6 +11,9 @@
     <el-input type="erea-text" v-model="realText" @input="textToAddress" />
 
     {{ reAddress }}
+
+        <v-distpicker v-model="address2"> </v-distpicker>
+    {{ address2 }}
   </div>
 </template>
 
@@ -45,6 +48,14 @@ export default {
         city: "市辖区",
         area_code: "",
         area: "河北区",
+      },
+       address2: {
+        province_code: "",
+        province: "",
+        city_code: "",
+        city: "",
+        area_code: "",
+        area: "",
       },
       realText: "浙江省温州市龙湾区蒲州街道xx路111号 15555555555 刘啊",
       reAddress: {},
@@ -65,6 +76,17 @@ export default {
         textFilter: ["电話", "電話", "聯系人"],
       });
       console.log(this.reAddress);
+
+
+this.address2={
+        province_code: "",
+        province: this.reAddress.province,
+        city_code: "",
+        city: this.reAddress.city,
+        area_code: "",
+        area: this.reAddress.area,
+      }
+
     },
   },
 };

src/Distpicker.vue

@@ -122,6 +122,39 @@ export default {
     this.checkArea();
     this.created = false;
   },
+  // computed: {
+  //   defaultAddr: {
+  //     set(v) {
+  //       console.log(v, 3);
+  //       this.$emit("cancel", v);
+  //     },
+  //     get() {
+  //       // return this.showModel;
+  //       console.log(2);
+  //       // 感觉使用setTimeout不是很严谨，但是目前还没有找到更好的办法解决
+  //       setTimeout(() => {
+  //         this.created = true;
+  //         this.checkProvince();
+  //         this.checkCity();
+  //         this.checkArea();
+  //         this.created = false;
+  //       }, 100);
+
+  //       return JSON.parse(JSON.stringify(this.value));
+  //     },
+  //   },
+  // },
+  mounted() {
+    this.$watch("value", (res) => {
+      console.log(11);
+      this.defaultAddr = JSON.parse(JSON.stringify(this.value));
+      this.created = true;
+      this.checkProvince();
+      this.checkCity();
+      this.checkArea();
+      this.created = false;
+    });
+  },
   //  不知道是哪里姿势不对用了此方法就一直无法获取父主键传过来的v-model
   // model: {
   //   // 使用model， 这儿2个属性，prop属性说，我要将msg作为该组件被使用时（此处为aa组件被父组件调用）v-model能取到的值，event说，我emit ‘cc’ 的时候，参数的值就是父组件v-model收到的值。
@@ -161,8 +194,8 @@ export default {
           this.defaultAddr.province_code = element.code;
           this.defaultAddr.province = element.name;
 
-          this.$emit("input", this.defaultAddr);
           if (!this.created) {
+            this.$emit("input", this.defaultAddr);
             this.defaultAddr.city_code = "";
             this.defaultAddr.area_code = "";
           }
@@ -178,13 +211,13 @@ export default {
           (!this.defaultAddr.code && element.name == this.defaultAddr.city)
         ) {
           this.areaJson = element.children;
-          if (!this.created) {
+
-            this.defaultAddr.area_code = "";
-          }
           this.defaultAddr.city_code = element.code;
           this.defaultAddr.city = element.name;
-
+          if (!this.created) {
-          this.$emit("input", this.defaultAddr);
+            this.$emit("input", this.defaultAddr);
+            this.defaultAddr.area_code = "";
+          }
         }
       });
     },
@@ -199,7 +232,9 @@ export default {
         ) {
           this.defaultAddr.area_code = element.code;
           this.defaultAddr.area = element.name;
-          this.$emit("input", this.defaultAddr);
+          if (!this.created) {
+            this.$emit("input", this.defaultAddr);
+          }
         }
       });
     },