Commit 68d39c008f6735caa426ddd86900d98788725957
1 parent
958405e8
底部导航的优化
Showing
9 changed files
with
89 additions
and
31 deletions
pages/cart/cart/cart.js
| @@ -1300,6 +1300,20 @@ Page({ | @@ -1300,6 +1300,20 @@ Page({ | ||
| 1300 | var prom_id=e.currentTarget.dataset.prom_id; | 1300 | var prom_id=e.currentTarget.dataset.prom_id; |
| 1301 | var url="/pages/goods/goodsList/goodsList?prom_type=3&prom_id="+prom_id; | 1301 | var url="/pages/goods/goodsList/goodsList?prom_type=3&prom_id="+prom_id; |
| 1302 | getApp().goto(url); | 1302 | getApp().goto(url); |
| 1303 | + }, | ||
| 1304 | + | ||
| 1305 | + load_nav(e){ | ||
| 1306 | + var $width=e.detail.width, //获取图片真实宽度 | ||
| 1307 | + $height=e.detail.height, | ||
| 1308 | + ratio=$width/$height; //图片的真实宽高比例 | ||
| 1309 | + var viewHeight=52, //设置图片显示宽度，左右留有16rpx边距 | ||
| 1310 | + viewWidth=viewHeight*ratio; //计算的高度值 | ||
| 1311 | + var image=this.data.tabBar.list[e.target.dataset.index]; | ||
| 1312 | + //将图片的datadata-index作为image对象的key,然后存储图片的宽高值 | ||
| 1313 | + image.width=viewWidth; | ||
| 1314 | + this.setData({ | ||
| 1315 | + ['tabBar.list['+e.target.dataset.index+']']:image | ||
| 1316 | + }) | ||
| 1303 | } | 1317 | } |
| 1304 | 1318 | ||
| 1305 | }); | 1319 | }); |
| 1306 | \ No newline at end of file | 1320 | \ No newline at end of file |
pages/cart/cart/cart.wxml
| 1 | +<import src="../../tabbar/tabbar.wxml" /> | ||
| 2 | +<template is="tabBar" data="{{tabBar}}" /> | ||
| 3 | + | ||
| 1 | <!-- 广告图片 --> | 4 | <!-- 广告图片 --> |
| 2 | <navigator class="picture" url="/pages/activity/seckill_list/seckill_list" wx:if="{{is_has_flash}}"> | 5 | <navigator class="picture" url="/pages/activity/seckill_list/seckill_list" wx:if="{{is_has_flash}}"> |
| 3 | <image class="picture" src="{{iurl}}miniapp/images/stores/Seckill.png"></image> | 6 | <image class="picture" src="{{iurl}}miniapp/images/stores/Seckill.png"></image> |
| @@ -181,5 +184,3 @@ | @@ -181,5 +184,3 @@ | ||
| 181 | 184 | ||
| 182 | 185 | ||
| 183 | <warn id="warn"></warn> | 186 | <warn id="warn"></warn> |
| 184 | -<import src="../../tabbar/tabbar.wxml" /> | ||
| 185 | -<template is="tabBar" data="{{tabBar}}" /> | ||
| 186 | \ No newline at end of file | 187 | \ No newline at end of file |
pages/goods/categoryList/categoryList.js
| @@ -962,4 +962,18 @@ Page({ | @@ -962,4 +962,18 @@ Page({ | ||
| 962 | func(ob); | 962 | func(ob); |
| 963 | }) | 963 | }) |
| 964 | }, | 964 | }, |
| 965 | + | ||
| 966 | + load_nav(e){ | ||
| 967 | + var $width=e.detail.width, //获取图片真实宽度 | ||
| 968 | + $height=e.detail.height, | ||
| 969 | + ratio=$width/$height; //图片的真实宽高比例 | ||
| 970 | + var viewHeight=52, //设置图片显示宽度，左右留有16rpx边距 | ||
| 971 | + viewWidth=viewHeight*ratio; //计算的高度值 | ||
| 972 | + var image=this.data.tabBar.list[e.target.dataset.index]; | ||
| 973 | + //将图片的datadata-index作为image对象的key,然后存储图片的宽高值 | ||
| 974 | + image.width=viewWidth; | ||
| 975 | + this.setData({ | ||
| 976 | + ['tabBar.list['+e.target.dataset.index+']']:image | ||
| 977 | + }) | ||
| 978 | + } | ||
| 965 | }); | 979 | }); |
| 966 | \ No newline at end of file | 980 | \ No newline at end of file |
pages/goods/categoryList/categoryList.wxml
| 1 | -<!-- 风格1 --> | 1 | +<import src="../../tabbar/tabbar.wxml" /> |
| 2 | +<template is="tabBar" data="{{tabBar}}" /> | ||
| 3 | + | ||
| 4 | +<!-- 风格1 --> | ||
| 2 | <block wx:if="{{is_used_share==0}}"> | 5 | <block wx:if="{{is_used_share==0}}"> |
| 3 | <view class='top_view' wx:if="{{is_show_pl || is_show_gb || is_show_pp }}"> | 6 | <view class='top_view' wx:if="{{is_show_pl || is_show_gb || is_show_pp }}"> |
| 4 | <view class="swiper-tab" > | 7 | <view class="swiper-tab" > |
| @@ -507,5 +510,3 @@ | @@ -507,5 +510,3 @@ | ||
| 507 | </block> | 510 | </block> |
| 508 | 511 | ||
| 509 | </block> | 512 | </block> |
| 510 | - <import src="../../tabbar/tabbar.wxml" /> | ||
| 511 | - <template is="tabBar" data="{{tabBar}}" /> | ||
| 512 | \ No newline at end of file | 513 | \ No newline at end of file |
pages/index/index/index.js
| @@ -827,6 +827,23 @@ Page({ | @@ -827,6 +827,23 @@ Page({ | ||
| 827 | is_disgraceful: 1 | 827 | is_disgraceful: 1 |
| 828 | }) | 828 | }) |
| 829 | }) | 829 | }) |
| 830 | + }, | ||
| 831 | + | ||
| 832 | + load_nav(e){ | ||
| 833 | + | ||
| 834 | + var $width=e.detail.width, //获取图片真实宽度 | ||
| 835 | + $height=e.detail.height, | ||
| 836 | + ratio=$width/$height; //图片的真实宽高比例 | ||
| 837 | + var viewHeight=52, //设置图片显示宽度，左右留有16rpx边距 | ||
| 838 | + viewWidth=viewHeight*ratio; //计算的高度值 | ||
| 839 | + var image=this.data.tabBar.list[e.target.dataset.index]; | ||
| 840 | + if(image.width) return fasle; | ||
| 841 | + | ||
| 842 | + //将图片的datadata-index作为image对象的key,然后存储图片的宽高值 | ||
| 843 | + image.width=viewWidth; | ||
| 844 | + this.setData({ | ||
| 845 | + ['tabBar.list['+e.target.dataset.index+']']:image | ||
| 846 | + }) | ||
| 830 | } | 847 | } |
| 831 | 848 | ||
| 832 | }); | 849 | }); |
| 833 | \ No newline at end of file | 850 | \ No newline at end of file |
pages/index/index/index.wxml
| 1 | +<import src="../../tabbar/tabbar.wxml" /> | ||
| 2 | +<template is="tabBar" data="{{tabBar}}"/> | ||
| 3 | + | ||
| 1 | <!--普通界面--> | 4 | <!--普通界面--> |
| 2 | <wxs module="filter" src="../../../utils/filter.wxs"></wxs> | 5 | <wxs module="filter" src="../../../utils/filter.wxs"></wxs> |
| 3 | <view class="container rel" wx:if="{{ishow}}"> | 6 | <view class="container rel" wx:if="{{ishow}}"> |
| @@ -360,8 +363,7 @@ | @@ -360,8 +363,7 @@ | ||
| 360 | </view> | 363 | </view> |
| 361 | </block> | 364 | </block> |
| 362 | 365 | ||
| 363 | - <import src="../../tabbar/tabbar.wxml" /> | ||
| 364 | - <template is="tabBar" data="{{tabBar}}"/> | 366 | + |
| 365 | 367 | ||
| 366 | 368 | ||
| 367 | 369 |
pages/tabbar/tabbar.wxml
| 1 | + | ||
| 1 | <!--pages/tabbar.wxml--> | 2 | <!--pages/tabbar.wxml--> |
| 2 | <template name="tabBar"> | 3 | <template name="tabBar"> |
| 3 | <!-- 如果是自定义的话 --> | 4 | <!-- 如果是自定义的话 --> |
| @@ -9,10 +10,10 @@ | @@ -9,10 +10,10 @@ | ||
| 9 | <view wx:if="{{item.nav_name=='购物车'}}" style="top:0;background-color: red;color: #fff;font-size: 20rpx;border-radius: 50%;width: 40rpx;line-height:40rpx;height: 40rpx;position: absolute;z-index: 100;right:30rpx;"> | 10 | <view wx:if="{{item.nav_name=='购物车'}}" style="top:0;background-color: red;color: #fff;font-size: 20rpx;border-radius: 50%;width: 40rpx;line-height:40rpx;height: 40rpx;position: absolute;z-index: 100;right:30rpx;"> |
| 10 | {{tabBar.cartGoodsNum}} | 11 | {{tabBar.cartGoodsNum}} |
| 11 | </view> | 12 | </view> |
| 12 | - <view style="width:35%;height:30px;margin-left:33%;"> | ||
| 13 | - <image src="{{item.src}}" wx:if="{{!item.active}}" mode="widthFix" class="img" style="max-width:100%;max-height:100%"></image> | 13 | + <view style="width:35%;height:54rpx;margin-left:33%;"> |
| 14 | + <image src="{{item.src}}" bindload="load_nav" data-index="{{ index }}" class="img" style="max-width: 100%; width:{{item.width?item.width:0}}rpx;height:52rpx"></image> | ||
| 14 | </view> | 15 | </view> |
| 15 | - <view style="height:20px;line-height:15px; position: relative; top: -15rpx"><text class="tabbar_text" wx:if="{{item.nav_name}}" style="font-size:0.6rem">{{item.nav_name}}</text></view> | 16 | + <view style="height:20px;line-height:15px; position: relative; top: -8rpx"><text class="tabbar_text" wx:if="{{item.nav_name}}" style="font-size:0.6rem">{{item.nav_name}}</text></view> |
| 16 | </navigator> | 17 | </navigator> |
| 17 | </block> | 18 | </block> |
| 18 | <block wx:else> | 19 | <block wx:else> |
| @@ -20,17 +21,10 @@ | @@ -20,17 +21,10 @@ | ||
| 20 | <view wx:if="{{item.nav_name=='购物车'}}" style="top:0;background-color: red;color: #fff;font-size: 20rpx;border-radius: 50%;width: 40rpx;line-height:40rpx;height: 40rpx;position: absolute;z-index: 100;right:30rpx;"> | 21 | <view wx:if="{{item.nav_name=='购物车'}}" style="top:0;background-color: red;color: #fff;font-size: 20rpx;border-radius: 50%;width: 40rpx;line-height:40rpx;height: 40rpx;position: absolute;z-index: 100;right:30rpx;"> |
| 21 | {{tabBar.cartGoodsNum}} | 22 | {{tabBar.cartGoodsNum}} |
| 22 | </view> | 23 | </view> |
| 23 | - <view style="width:35%;height:30px;margin-left:33%;"> | ||
| 24 | - <block wx:if="{{item.active}}"> | ||
| 25 | - <image src="{{item.src_sele}}" mode="widthFix" class="img" style="max-width:100%;max-height:100%"></image> | ||
| 26 | - </block> | ||
| 27 | - <block wx:else> | ||
| 28 | - <navigator url="{{item.weappurl}}"> | ||
| 29 | - <image src="{{item.src}}" wx:if="{{!item.active}}" mode="widthFix" class="img" style="max-width:100%;max-height:100%"></image> | ||
| 30 | - </navigator> | ||
| 31 | - </block> | 24 | + <view style="width:35%;height:54rpx;margin-left:33%;"> |
| 25 | + <image src="{{item.src_sele}}" bindload="load_nav" data-index="{{ index }}" class="img" style="max-width: 100%;width:{{item.width?item.width:0}}rpx;height:52rpx"></image> | ||
| 32 | </view> | 26 | </view> |
| 33 | - <view style="height:20px;line-height:15px; position: relative; top: -15rpx"><text class="tabbar_text" wx:if="{{item.nav_name}}" style="font-size:0.6rem">{{item.nav_name}}</text></view> | 27 | + <view style="height:20px;line-height:15px; position: relative; top: -8rpx"><text class="tabbar_text" wx:if="{{item.nav_name}}" style="font-size:0.6rem">{{item.nav_name}}</text></view> |
| 34 | </view> | 28 | </view> |
| 35 | </block> | 29 | </block> |
| 36 | 30 | ||
| @@ -43,7 +37,7 @@ | @@ -43,7 +37,7 @@ | ||
| 43 | <!-- 1 --> | 37 | <!-- 1 --> |
| 44 | <block wx:if="{{tabBar.active!='/pages/index/index/index'}}"> | 38 | <block wx:if="{{tabBar.active!='/pages/index/index/index'}}"> |
| 45 | <navigator url="/pages/index/index/index" class="tabbar_item {{item.clas}}" open-type="redirect" style="position:relative;width:25%;height:100%;float:left;text-align:center;padding:2px 0;"> | 39 | <navigator url="/pages/index/index/index" class="tabbar_item {{item.clas}}" open-type="redirect" style="position:relative;width:25%;height:100%;float:left;text-align:center;padding:2px 0;"> |
| 46 | - <view style="width:30%;height:57rpx;margin-left:35%;"> | 40 | + <view style="width:30%;height:54rpx;margin-left:35%;"> |
| 47 | <image src="{{tabBar.url}}/miniapp/images/bar/index.png" class="img" style="width:100%;height:100%"></image> | 41 | <image src="{{tabBar.url}}/miniapp/images/bar/index.png" class="img" style="width:100%;height:100%"></image> |
| 48 | </view> | 42 | </view> |
| 49 | <view style="height:40rpx;line-height:22rpx;"><text class="tabbar_text" style="font-size:0.6rem">首页</text></view> | 43 | <view style="height:40rpx;line-height:22rpx;"><text class="tabbar_text" style="font-size:0.6rem">首页</text></view> |
| @@ -51,7 +45,7 @@ | @@ -51,7 +45,7 @@ | ||
| 51 | </block> | 45 | </block> |
| 52 | <block wx:else> | 46 | <block wx:else> |
| 53 | <view class="tabbar_item {{item.clas}}" style="color:#f23030;position:relative;width:25%;height:100%;float:left;text-align:center;padding:2px 0;"> | 47 | <view class="tabbar_item {{item.clas}}" style="color:#f23030;position:relative;width:25%;height:100%;float:left;text-align:center;padding:2px 0;"> |
| 54 | - <view style="width:30%;height:57rpx;margin-left:35%;"> | 48 | + <view style="width:30%;height:54rpx;margin-left:35%;"> |
| 55 | <image src="{{tabBar.url}}/miniapp/images/bar/index_on.png" class="img" style="width:100%;height:100%"></image> | 49 | <image src="{{tabBar.url}}/miniapp/images/bar/index_on.png" class="img" style="width:100%;height:100%"></image> |
| 56 | </view> | 50 | </view> |
| 57 | <view style="height:40rpx;line-height:22rpx;"><text class="tabbar_text" style="font-size:0.6rem">首页</text></view> | 51 | <view style="height:40rpx;line-height:22rpx;"><text class="tabbar_text" style="font-size:0.6rem">首页</text></view> |
| @@ -62,7 +56,7 @@ | @@ -62,7 +56,7 @@ | ||
| 62 | <!-- 2 --> | 56 | <!-- 2 --> |
| 63 | <block wx:if="{{tabBar.active!='/pages/goods/categoryList/categoryList'}}"> | 57 | <block wx:if="{{tabBar.active!='/pages/goods/categoryList/categoryList'}}"> |
| 64 | <navigator url="/pages/goods/categoryList/categoryList" class="tabbar_item {{tabBar.clas}}" open-type="redirect" style="position:relative;width:25%;height:100%;float:left;text-align:center;padding:2px 0;"> | 58 | <navigator url="/pages/goods/categoryList/categoryList" class="tabbar_item {{tabBar.clas}}" open-type="redirect" style="position:relative;width:25%;height:100%;float:left;text-align:center;padding:2px 0;"> |
| 65 | - <view style="width:30%;height:57rpx;margin-left:35%;"> | 59 | + <view style="width:30%;height:54rpx;margin-left:35%;"> |
| 66 | <image src="{{tabBar.url}}/miniapp/images/bar/fl.png" class="img" style="width:100%;height:100%"></image> | 60 | <image src="{{tabBar.url}}/miniapp/images/bar/fl.png" class="img" style="width:100%;height:100%"></image> |
| 67 | </view> | 61 | </view> |
| 68 | <view style="height:40rpx;line-height:22rpx;"><text class="tabbar_text" wx:if="分类" style="font-size:0.6rem">分类</text></view> | 62 | <view style="height:40rpx;line-height:22rpx;"><text class="tabbar_text" wx:if="分类" style="font-size:0.6rem">分类</text></view> |
| @@ -70,7 +64,7 @@ | @@ -70,7 +64,7 @@ | ||
| 70 | </block> | 64 | </block> |
| 71 | <block wx:else> | 65 | <block wx:else> |
| 72 | <view class="tabbar_item {{tabBar.clas}}" style="color:#f23030;position:relative;width:25%;height:100%;float:left;text-align:center;padding:2px 0;"> | 66 | <view class="tabbar_item {{tabBar.clas}}" style="color:#f23030;position:relative;width:25%;height:100%;float:left;text-align:center;padding:2px 0;"> |
| 73 | - <view style="width:30%;height:57rpx;margin-left:35%;"> | 67 | + <view style="width:30%;height:54rpx;margin-left:35%;"> |
| 74 | <image src="{{tabBar.url}}/miniapp/images/bar/fl_on.png" class="img" style="width:100%;height:100%"></image> | 68 | <image src="{{tabBar.url}}/miniapp/images/bar/fl_on.png" class="img" style="width:100%;height:100%"></image> |
| 75 | </view> | 69 | </view> |
| 76 | <view style="height:40rpx;line-height:22rpx;"><text class="tabbar_text" wx:if="分类" style="font-size:0.6rem">分类</text></view> | 70 | <view style="height:40rpx;line-height:22rpx;"><text class="tabbar_text" wx:if="分类" style="font-size:0.6rem">分类</text></view> |
| @@ -83,7 +77,7 @@ | @@ -83,7 +77,7 @@ | ||
| 83 | <navigator url="/pages/cart/cart/cart" open-type="redirect" class="tabbar_item {{tabBar.clas}}" style="position:relative;width:25%;height:100%;float:left;text-align:center;padding:2px 0;"> | 77 | <navigator url="/pages/cart/cart/cart" open-type="redirect" class="tabbar_item {{tabBar.clas}}" style="position:relative;width:25%;height:100%;float:left;text-align:center;padding:2px 0;"> |
| 84 | <view style="background-color: red;color: #fff;font-size: 20rpx;border-radius: 50%;width: 40rpx;height: 40rpx;line-heith:40rpx;position: fixed;z-index: 100;left:63%"> | 78 | <view style="background-color: red;color: #fff;font-size: 20rpx;border-radius: 50%;width: 40rpx;height: 40rpx;line-heith:40rpx;position: fixed;z-index: 100;left:63%"> |
| 85 | {{tabBar.cartGoodsNum}} | 79 | {{tabBar.cartGoodsNum}} |
| 86 | - </view><view style="width:30%;height:57rpx;margin-left:35%;"> | 80 | + </view><view style="width:30%;height:54rpx;margin-left:35%;"> |
| 87 | <image src="{{tabBar.url}}/miniapp/images/bar/car.png" class="img" style="width:100%;height:100%"></image> | 81 | <image src="{{tabBar.url}}/miniapp/images/bar/car.png" class="img" style="width:100%;height:100%"></image> |
| 88 | </view> | 82 | </view> |
| 89 | <view style="height:40rpx;line-height:22rpx;"><text class="tabbar_text" style="font-size:0.6rem">购物车</text></view> | 83 | <view style="height:40rpx;line-height:22rpx;"><text class="tabbar_text" style="font-size:0.6rem">购物车</text></view> |
| @@ -93,7 +87,7 @@ | @@ -93,7 +87,7 @@ | ||
| 93 | <view class="tabbar_item {{tabBar.clas}}" style="color: #f23030;position:relative;width:25%;height:100%;float:left;text-align:center;padding:2px 0;"> | 87 | <view class="tabbar_item {{tabBar.clas}}" style="color: #f23030;position:relative;width:25%;height:100%;float:left;text-align:center;padding:2px 0;"> |
| 94 | <view style="background-color: red;color: #fff;font-size: 20rpx;border-radius: 50%;width: 40rpx;height: 40rpx;line-heith:40rpx;position: fixed;z-index: 100;left:63%"> | 88 | <view style="background-color: red;color: #fff;font-size: 20rpx;border-radius: 50%;width: 40rpx;height: 40rpx;line-heith:40rpx;position: fixed;z-index: 100;left:63%"> |
| 95 | {{tabBar.cartGoodsNum}} | 89 | {{tabBar.cartGoodsNum}} |
| 96 | - </view><view style="width:30%;height:57rpx;margin-left:35%;"> | 90 | + </view><view style="width:30%;height:54rpx;margin-left:35%;"> |
| 97 | <image src="{{tabBar.url}}/miniapp/images/bar/car_on.png" class="img" style="width:100%;height:100%"></image> | 91 | <image src="{{tabBar.url}}/miniapp/images/bar/car_on.png" class="img" style="width:100%;height:100%"></image> |
| 98 | </view> | 92 | </view> |
| 99 | <view style="height:40rpx;line-height:22rpx;"><text class="tabbar_text" style="font-size:0.6rem">购物车</text></view> | 93 | <view style="height:40rpx;line-height:22rpx;"><text class="tabbar_text" style="font-size:0.6rem">购物车</text></view> |
| @@ -103,7 +97,7 @@ | @@ -103,7 +97,7 @@ | ||
| 103 | <!-- 4 --> | 97 | <!-- 4 --> |
| 104 | <block wx:if="{{tabBar.active!='/pages/user/index/index'}}"> | 98 | <block wx:if="{{tabBar.active!='/pages/user/index/index'}}"> |
| 105 | <navigator url="/pages/user/index/index" open-type="redirect" class="tabbar_item {{tabBar.clas}}" style="position:relative;width:25%;height:100%;float:left;text-align:center;padding:2px 0;"> | 99 | <navigator url="/pages/user/index/index" open-type="redirect" class="tabbar_item {{tabBar.clas}}" style="position:relative;width:25%;height:100%;float:left;text-align:center;padding:2px 0;"> |
| 106 | - <view style="width:30%;height:57rpx;margin-left:35%;"> | 100 | + <view style="width:30%;height:54rpx;margin-left:35%;"> |
| 107 | <image src="{{tabBar.url}}/miniapp/images/bar/user.png" class="img" style="width:100%;height:100%"></image> | 101 | <image src="{{tabBar.url}}/miniapp/images/bar/user.png" class="img" style="width:100%;height:100%"></image> |
| 108 | </view> | 102 | </view> |
| 109 | <view style="height:40rpx;line-height:22rpx;"><text class="tabbar_text" style="font-size:0.6rem">我的</text></view> | 103 | <view style="height:40rpx;line-height:22rpx;"><text class="tabbar_text" style="font-size:0.6rem">我的</text></view> |
| @@ -111,8 +105,8 @@ | @@ -111,8 +105,8 @@ | ||
| 111 | </block> | 105 | </block> |
| 112 | <block wx:else> | 106 | <block wx:else> |
| 113 | <view class="tabbar_item {{tabBar.clas}}" style="color: #f23030;position:relative;width:25%;height:100%;float:left;text-align:center;padding:2px 0;"> | 107 | <view class="tabbar_item {{tabBar.clas}}" style="color: #f23030;position:relative;width:25%;height:100%;float:left;text-align:center;padding:2px 0;"> |
| 114 | - <view style="width:30%;height:57rpx;margin-left:35%;"> | ||
| 115 | - <image src="{{tabBar.url}}/miniapp/images/bar/user_on.png" class="img" style="width:100%;height:100%"></image> | 108 | + <view style="width:30%;height:54rpx;margin-left:35%;"> |
| 109 | + <image src="{{tabBar.url}}/miniapp/images/bar/user_on.png" class="img" style="width:100%;height:100%"></image> | ||
| 116 | </view> | 110 | </view> |
| 117 | <view style="height:40rpx;line-height:22rpx;"><text class="tabbar_text" style="font-size:0.6rem">我的</text></view> | 111 | <view style="height:40rpx;line-height:22rpx;"><text class="tabbar_text" style="font-size:0.6rem">我的</text></view> |
| 118 | </view> | 112 | </view> |
pages/user/index/index.js
| @@ -638,6 +638,20 @@ Page({ | @@ -638,6 +638,20 @@ Page({ | ||
| 638 | 638 | ||
| 639 | } | 639 | } |
| 640 | }) | 640 | }) |
| 641 | + }, | ||
| 642 | + | ||
| 643 | + load_nav(e){ | ||
| 644 | + var $width=e.detail.width, //获取图片真实宽度 | ||
| 645 | + $height=e.detail.height, | ||
| 646 | + ratio=$width/$height; //图片的真实宽高比例 | ||
| 647 | + var viewHeight=52, //设置图片显示宽度，左右留有16rpx边距 | ||
| 648 | + viewWidth=viewHeight*ratio; //计算的高度值 | ||
| 649 | + var image=this.data.tabBar.list[e.target.dataset.index]; | ||
| 650 | + //将图片的datadata-index作为image对象的key,然后存储图片的宽高值 | ||
| 651 | + image.width=viewWidth; | ||
| 652 | + this.setData({ | ||
| 653 | + ['tabBar.list['+e.target.dataset.index+']']:image | ||
| 654 | + }) | ||
| 641 | } | 655 | } |
| 642 | 656 | ||
| 643 | 657 |
pages/user/index/index.wxml
| 1 | +<import src="../../tabbar/tabbar.wxml" /> | ||
| 2 | +<template is="tabBar" data="{{tabBar}}" /> | ||
| 3 | + | ||
| 1 | <view class="xc-page" style="margin-bottom:{{isIpx ? '168rpx' : '100rpx'}}"> | 4 | <view class="xc-page" style="margin-bottom:{{isIpx ? '168rpx' : '100rpx'}}"> |
| 2 | <view class="xc-user"> | 5 | <view class="xc-user"> |
| 3 | <view class="xc-head rel"> | 6 | <view class="xc-head rel"> |
| @@ -297,5 +300,3 @@ | @@ -297,5 +300,3 @@ | ||
| 297 | </view> | 300 | </view> |
| 298 | 301 | ||
| 299 | <pop_txt id="pop_txt"></pop_txt> | 302 | <pop_txt id="pop_txt"></pop_txt> |
| 300 | - <import src="../../tabbar/tabbar.wxml" /> | ||
| 301 | - <template is="tabBar" data="{{tabBar}}" /> | ||
| 302 | \ No newline at end of file | 303 | \ No newline at end of file |