[更新]修复tabbar页面内容被遮挡的问题

This commit is contained in:
唐明明
2020-12-30 17:05:52 +08:00
parent 26bdcb6ffb
commit 6df09b6f82
9 changed files with 152 additions and 142 deletions

View File

@@ -10,8 +10,8 @@ page{
font-size: 30rpx; font-size: 30rpx;
} }
.tabBar{ .tabBarContent{
margin-bottom: calc(48px + env(safe-area-inset-bottom)); border-bottom: solid calc(48px + env(safe-area-inset-bottom)) transparent;
} }
/* /*

View File

@@ -6,6 +6,7 @@
*/ */
.tab-bar { .tab-bar {
z-index: 999999;
position: fixed; position: fixed;
bottom: 0; bottom: 0;
left: 0; left: 0;

View File

@@ -8,5 +8,6 @@
}, },
"navigationBarTitleText": "商城", "navigationBarTitleText": "商城",
"enablePullDownRefresh" : true, "enablePullDownRefresh" : true,
"navigationBarBackgroundColor": "#ea4e2f" "navigationBarTextStyle": "white",
"navigationBarBackgroundColor": "#2d6bf6"
} }

View File

@@ -1,6 +1,7 @@
<!-- 企获客商城 --> <!-- 企获客商城 -->
<view class="mallBox"> <view class="mallBox">
<view class="mallCont"> <view class="mallCont">
<view class="tabBarContent">
<!-- 搜索 --> <!-- 搜索 -->
<navigator hover-class="none" url="/pages/mall/mall_search/mall_search" class="mallCont-search"> <navigator hover-class="none" url="/pages/mall/mall_search/mall_search" class="mallCont-search">
<image class="mallCont-search-icon" src="/static/mall_icon/mall_search.png"></image> <image class="mallCont-search-icon" src="/static/mall_icon/mall_search.png"></image>
@@ -39,5 +40,5 @@
</block> </block>
</view> </view>
</view> </view>
</view>
<storeTabBar pages-url="pages/mall/index"></storeTabBar> <storeTabBar pages-url="pages/mall/index"></storeTabBar>

View File

@@ -16,7 +16,7 @@ page {
.mallBox::after { .mallBox::after {
position: absolute; position: absolute;
content: ''; content: '';
background-color: #ea4e2f; background-color: #2d6bf6;
border-radius: 0 0 10% 10%; border-radius: 0 0 10% 10%;
width: 100%; width: 100%;
height: 38vh; height: 38vh;

View File

@@ -41,8 +41,8 @@ Page({
/** /**
* 生命周期函数--监听页面显示 * 生命周期函数--监听页面显示
*/ */
onShow: function () { onShow() {
wx.hideHomeButton()
this.couponInfo(); this.couponInfo();
}, },
couponInfo() { couponInfo() {

View File

@@ -1,5 +1,5 @@
<!-- 优惠券 --> <!-- 优惠券 -->
<view class="coupon"> <view class="coupon tabBarContent">
<!-- 轮播图 --> <!-- 轮播图 -->
<view class="banner"> <view class="banner">
<swiper class="banner-swiper" indicator-dots autoplay circular interval="3500" indicator-color="#ebebeb" <swiper class="banner-swiper" indicator-dots autoplay circular interval="3500" indicator-color="#ebebeb"
@@ -87,3 +87,5 @@
</view> </view>
</view> </view>
</view> </view>
<storeTabBar pages-url="pages/ticket/index"></storeTabBar>

View File

@@ -3,8 +3,12 @@
* 企获客商城 * 企获客商城
*/ */
page{
background: white;
}
.coupon { .coupon {
margin: 0 20rpx; padding: 0 30rpx;
} }
/* 轮播图 */ /* 轮播图 */

View File

@@ -1,3 +1,4 @@
<view class="tabBarContent">
<!-- 个人中心 --> <!-- 个人中心 -->
<view class="userTop"> <view class="userTop">
<view class="userTop-head"> <view class="userTop-head">
@@ -105,5 +106,5 @@
</navigator> </navigator>
</view> </view>
</view> </view>
</view>
<storeTabBar pages-url="pages/user/index"></storeTabBar> <storeTabBar pages-url="pages/user/index"></storeTabBar>