优化选择地区自动绑定model以及地址自动识别示例编写

examples/components/index.vue

@@ -1,25 +1,72 @@
 <template>
   <div class="app-container">
-      <v-distpicker> </v-distpicker>
+    地区选择
+
+    <v-distpicker v-model="address"> </v-distpicker>
+    {{ address }}
+
+    <v-distpicker v-model="address1"> </v-distpicker>
+    {{ address1 }}
+    地址识别
+    <el-input type="erea-text" v-model="realText" @input="textToAddress" />
+
+    {{ reAddress }}
   </div>
 </template>
 
 <script>
-import VDistpicker from "../../src/Distpicker"
+// import VDistpicker from "../../src/Distpicker"
+import index from "../../src/index";
+let VDistpicker = index.VDistpicker;
+let AddressParse = index.AddressParse;
+
 // import Pagination from '@/components/Pagination' // Secondary package based on el-pagination
 
 export default {
   name: "ArticleList",
-    components: { VDistpicker },
+  components: { VDistpicker },
 
   data() {
-    return {};
+    return {
+      // address:'121'
+      address: {
+        province_code: "12",
+        province: "",
+        city_code: "1201",
+        city: "",
+        area_code: "120102",
+        area: "",
+      },
+
+      address1: {
+        province_code: "",
+        province: "天津市",
+        city_code: "",
+        city: "市辖区",
+        area_code: "",
+        area: "河北区",
+      },
+      realText: "浙江省温州市龙湾区蒲州街道xx路111号 15555555555 刘啊",
+      reAddress: {},
+    };
   },
   beforeCreated() {},
   watch: {},
-  created() {},
+  created() {
+    this.textToAddress();
+  },
   mounted() {},
-  methods: {},
+  methods: {
+    textToAddress() {
+      console.log(11);
+      let type = 1;
+      this.reAddress = AddressParse(this.realText, {
+        type,
+        textFilter: ["电話", "電話", "聯系人"],
+      });
+      console.log(this.reAddress);
+    },
+  },
 };
 </script>