css

pages/mine/userAddress.vue

 <template>
     <view class="page-userAddress">
         <navElement title="地址管理"></navElement>
-        <view class="tip row verCenter">
+        <view class="tip row verCenter" style="margin-bottom: 16rpx;margin-top: 0;">
             <text class="iconfont icon-ts"></text>
             <text class="t1">已创建</text>
-            <text class="t2">2</text>
+            <text class="t2">{{ list.length }}</text>
             <text class="t1">个收货地址，最多</text>
             <text class="t2">20</text>
             <text class="t1">个</text>
         </view>
-        <view class="list">
-            <view class="box">
+        <view class="list" v-if="list.length > 0">
+            <view class="box" v-for="(item, index) in list" :key="index">
                 <view class="p1 row verCenter">
-                    <text class="t1">蔡先生</text>
-                    <text class="t2">13800138000</text>
+                    <text class="t1">{{ item.consignee }}</text>
+                    <text class="t2">{{ item.mobile }}</text>
                 </view>
-                <view class="p2">广东省深圳市龙岗区坂田清丽路1号宝能科技园南区12栋11楼</view>
+                <view class="p2">{{ item.province_val }}{{ item.city_val }}{{ item.district_val }}{{ item.detail_address }}</view>
                 <view class="operate row bothSide verCenter">
-                    <view class="row verCenter">
-                        <view class="default"></view>
-                        <text class="default-text">设为默认</text>
-                    </view>
-                    <view class="row verCenter">
-                        <navigator class="edit row verCenter" url="/user/userAddressEdit" hover-class="none">
-                            <text class="iconfont icon-bjt"></text>
-                            <text class="tt">编辑</text>
-                        </navigator>
-                        <view class="delete row verCenter">
-                            <text class="iconfont icon-del"></text>
-                            <text class="tt">删除</text>
+                    <template v-if="item.is_default == 1">
+                        <view class="row verCenter default-curr">
+                            <view class="default"></view>
+                            <text class="default-text">默认地址</text>
                         </view>
-                    </view>
-                </view>
-            </view>
-            <view class="box">
-                <view class="p1 row verCenter">
-                    <text class="t1">蔡先生</text>
-                    <text class="t2">13800138000</text>
-                </view>
-                <view class="p2">广东省深圳市龙岗区坂田清丽路1号宝能科技园南区12栋11楼</view>
-                <view class="operate row bothSide verCenter">
-                    <view class="row verCenter default-curr">
-                        <view class="default"></view>
-                        <text class="default-text">设为默认</text>
-                    </view>
+                    </template>
+                    <template v-else>
+                        <view class="row verCenter">
+                            <view class="default"></view>
+                            <text class="default-text">设为默认</text>
+                        </view>
+                    </template>
                     <view class="row verCenter">
                         <navigator class="edit row verCenter" url="/user/userAddressEdit" hover-class="none">
                             <text class="iconfont icon-bjt"></text>
@@ -57,7 +42,7 @@
                 </view>
             </view>
         </view>
-        <view class="no-data column rowCenter verCenter">
+        <view class="no-data column rowCenter verCenter" v-else>
             <image src="../../static/nodate.png"></image>
             <text class="tt">暂无收货地址</text>
         </view>
@@ -80,14 +65,19 @@ export default {
     },
     data() {
         return {
-            curr: 0,
-            text_arr: ['未使用', '已使用', '已过期']
+            list: []
         };
     },
-    onLoad() {},
+    onShow() {
+        this.getData();
+    },
     methods: {
-        tab(index) {
-            this.curr = index;
+        getData() {
+            this.request(Api_Url + '/address/recvlist', 'POST', {}, true, true).then(res => {
+                if (res.err_code === 0) {
+                    this.list = res.data;
+                }
+            });
         }
     }
 };