✨ feat: 地址输入模块新增详细地址录入功能

 <!--
 <!--
  * @Date: 2022-08-30 14:32:11
  * @Date: 2022-08-30 14:32:11
  * @LastEditors: hookehuyr hookehuyr@gmail.com
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2022-08-30 17:56:04
+ * @LastEditTime: 2022-09-06 15:53:10
  * @FilePath: /data-table/src/components/AreaPickerField/index.vue
  * @FilePath: /data-table/src/components/AreaPickerField/index.vue
  * @Description: 文件描述
  * @Description: 文件描述
 -->
 -->
@@ -10,8 +10,10 @@
     <div class="label">{{ item.label }}<span v-if="item.required">&nbsp;*</span></div>
     <div class="label">{{ item.label }}<span v-if="item.required">&nbsp;*</span></div>
     <van-field v-model="item.value" is-link readonly :name="item.key" :required="item.required"
     <van-field v-model="item.value" is-link readonly :name="item.key" :required="item.required"
       :placeholder="item.placeholder" :rules="item.rules" @click="showPicker = true" />
       :placeholder="item.placeholder" :rules="item.rules" @click="showPicker = true" />
+    <van-field name="address" v-model="item.address" placeholder="详细地址" />
     <van-popup v-model:show="showPicker" position="bottom">
     <van-popup v-model:show="showPicker" position="bottom">
-      <van-area v-model="item.code" title="" :area-list="areaList" @confirm="onConfirm" @cancel="showPicker = false" />
+      <van-area name="city_code" v-model="item.city_code" title="" :area-list="areaList" @confirm="onConfirm"
+        @cancel="showPicker = false" />
     </van-popup>
     </van-popup>
   </div>
   </div>
 </template>
 </template>
@@ -21,7 +23,9 @@ import { areaList } from '@vant/area-data';
 
 
 const props = defineProps({
 const props = defineProps({
   item: Object
   item: Object
-})
+});
+
+const address = ref('')
 
 
 const showPicker = ref(false);
 const showPicker = ref(false);
 const fieldValue = ref('');
 const fieldValue = ref('');

 <!--
 <!--
  * @Date: 2022-07-18 10:22:22
  * @Date: 2022-07-18 10:22:22
  * @LastEditors: hookehuyr hookehuyr@gmail.com
  * @LastEditors: hookehuyr hookehuyr@gmail.com
- * @LastEditTime: 2022-09-06 15:24:52
+ * @LastEditTime: 2022-09-06 15:53:40
  * @FilePath: /data-table/src/views/index.vue
  * @FilePath: /data-table/src/views/index.vue
  * @Description: 首页
  * @Description: 首页
 -->
 -->
@@ -55,17 +55,17 @@ onMounted(() => {
     },
     },
     required: true,
     required: true,
   },
   },
-  {
-    key: 'email',
-    value: '',
-    label: '邮箱',
-    placeholder: '请输入邮箱',
-    component: '',
-    component_props: {
-      name: 'email'
-    },
-    required: true,
-  },
+  // {
+  //   key: 'email',
+  //   value: '',
+  //   label: '邮箱',
+  //   placeholder: '请输入邮箱',
+  //   component: '',
+  //   component_props: {
+  //     name: 'email'
+  //   },
+  //   required: true,
+  // },
   // {
   // {
   //   key: 'age',
   //   key: 'age',
   //   value: '',
   //   value: '',
@@ -141,7 +141,8 @@ onMounted(() => {
     key: 'city',
     key: 'city',
     value: '天津市/天津市/和平区',
     value: '天津市/天津市/和平区',
     city_code: '120101',
     city_code: '120101',
-    label: '省市区',
+    label: '地址',
+    address: '',
     placeholder: '请选择省市区',
     placeholder: '请选择省市区',
     component_props: {
     component_props: {
       name: 'area_picker'
       name: 'area_picker'
@@ -176,7 +177,7 @@ onMounted(() => {
 
 
 const onSubmit = (values) => {
 const onSubmit = (values) => {
   console.log('submit', values);
   console.log('submit', values);
-  // console.warn(mockData.value);
+  console.warn(mockData.value);
 };
 };
 
 
 </script>
 </script>