[improvement] AddressEdit: add more props (#1790)

packages/address-edit/Detail.vue

@@ -1,10 +1,10 @@
 <template>
-  <div>
+  <div :class="b()">
     <field
       v-on="$listeners"
-      ref="field"
-      rows="1"
       autosize
+      ref="field"
+      :rows="detailRows"
       :clearable="!isAndroid"
       type="textarea"
       maxlength="200"
@@ -51,6 +51,7 @@ export default create({
     value: String,
     error: Boolean,
     focused: Boolean,
+    detailRows: Number,
     searchResult: Array,
     showSearchResult: Boolean
   },

packages/address-edit/index.vue

@@ -3,6 +3,7 @@
     <cell-group>
       <field
         v-model="data.name"
+        clearable
         maxlength="15"
         :label="$t('name')"
         :placeholder="$t('namePlaceholder')"
@@ -11,6 +12,7 @@
       />
       <field
         v-model="data.tel"
+        clearable
         type="tel"
         :label="$t('tel')"
         :placeholder="$t('telPlaceholder')"
@@ -18,16 +20,19 @@
         @focus="onFocus('tel')"
       />
       <field
+        v-show="showArea"
         readonly
         :label="$t('area')"
         :placeholder="$t('areaPlaceholder')"
         :value="areaText"
-        @click="showArea = true"
+        @click="showAreaPopup = true"
       />
       <address-edit-detail
+        v-show="showDetail"
         :focused="detailFocused"
         :value="data.addressDetail"
         :error="errorInfo.addressDetail"
+        :detail-rows="detailRows"
         :search-result="searchResult"
         :show-search-result="showSearchResult"
         @focus="onFocus('addressDetail')"
@@ -65,14 +70,14 @@
       </van-button>
     </div>
 
-    <popup v-model="showArea" position="bottom" :lazy-render="false" :get-container="getAreaContainer">
+    <popup v-model="showAreaPopup" position="bottom" :lazy-render="false" :get-container="getAreaContainer">
       <van-area
         ref="area"
         :loading="!areaListLoaded"
         :value="data.areaCode"
         :area-list="areaList"
         @confirm="onAreaConfirm"
-        @cancel="showArea = false"
+        @cancel="showAreaPopup = false"
       />
     </popup>
   </div>
@@ -126,6 +131,18 @@ export default create({
     showSearchResult: Boolean,
     saveButtonText: String,
     deleteButtonText: String,
+    showArea: {
+      type: Boolean,
+      default: true
+    },
+    showDetail: {
+      type: Boolean,
+      default: true
+    },
+    detailRows: {
+      type: Number,
+      default: 1
+    },
     addressInfo: {
       type: Object,
       default: () => ({ ...defaultData })
@@ -143,7 +160,7 @@ export default create({
   data() {
     return {
       data: {},
-      showArea: false,
+      showAreaPopup: false,
       detailFocused: false,
       errorInfo: {
         tel: false,
@@ -209,7 +226,7 @@ export default create({
     },
 
     onAreaConfirm(values) {
-      this.showArea = false;
+      this.showAreaPopup = false;
       this.data.areaCode = values[2].code;
       this.assignAreaValues(values);
       this.$emit('change-area', values);
@@ -290,6 +307,10 @@ export default create({
       });
     },
 
+    setAddressDetail(value) {
+      this.data.addressDetail = value;
+    },
+
     getAreaContainer() {
       return document.body;
     }

packages/address-edit/test/__snapshots__/demo.spec.js.snap

@@ -53,7 +53,7 @@ exports[`renders demo correctly 1`] = `
           </div>
           <!---->
         </div>
-        <div>
+        <div class="van-address-edit-detail">
           <div rows="1" maxlength="200" placeholder="街道门牌、楼层房间号等信息" class="van-cell van-hairline van-field">
             <!---->
             <div class="van-cell__title"><span>详细地址</span>

packages/address-edit/test/__snapshots__/index.spec.js.snap

@@ -51,7 +51,7 @@ exports[`create a AddressEdit 1`] = `
       </div>
       <!---->
     </div>
-    <div>
+    <div class="van-address-edit-detail">
       <div rows="1" maxlength="200" placeholder="街道门牌、楼层房间号等信息" class="van-cell van-hairline van-field">
         <!---->
         <div class="van-cell__title"><span>详细地址</span>
@@ -156,7 +156,7 @@ exports[`create a AddressEdit with props 1`] = `
       </div>
       <!---->
     </div>
-    <div>
+    <div class="van-address-edit-detail">
       <div rows="1" maxlength="200" placeholder="街道门牌、楼层房间号等信息" class="van-cell van-hairline van-field">
         <!---->
         <div class="van-cell__title"><span>详细地址</span>

packages/vant-css/src/address-edit.css

@@ -27,9 +27,11 @@
     color: $gray-dark;
   }
 
-  &-detail__finish {
+  &-detail {
+    &__finish {
       color: $blue;
       font-size: 12px;
       display: block;
     }
+  }
 }