首页 > 编程语言 >支付宝小程序 hideTabBar 无效,出现两个 TabBar

支付宝小程序 hideTabBar 无效,出现两个 TabBar

时间:2023-05-28 12:22:04浏览次数:56  
标签:支付宝 TabBar 自定义 程序 tabBar hideTabBar

问题描述:

使用 uni-app 开发的小程序,使用组件的形式做了自定义 TabBar,在部分支付宝小程序中出现了两个 TabBar

在支付宝小程序的开发社区中也有类似问题的反馈
《hideTabBar IOS失效,模拟器和安卓正常》

《真机上调用my.hideTabBar无效》

《tabbar隐藏在特殊情况下无效的问题》

 

解决方案:

这个问题应该是支付宝基础库的问题,除了依赖于官方更新之外,开发者可以利用《自定义 tabBar》曲线救国

也就是创建一个空内容的自定义tabBar,这样即使 tabBar 被渲染出来,但从视觉上也不会有问题

在 src/pages.json 文件中定义自定义tabBar(可以限制为支付宝小程序中生效)

{
  "tabBar": {
    // #ifdef MP-ALIPAY
    "customize": true
    // #endif

    // ... 其他配置
  }
}

然后创建 src/customize-tab-bar 目录及以下文件

 index.axml

<view class="hidden-alipay-tab-bar"></view>

index.acss

.hidden-alipay-tab-bar {
  display: none;
}

index.js

/**
 * 注意:该自定义 tab-bar 不可删除!!!
 * 部分支付宝小程序无法使用 hideTabBar 隐藏原生 tabBar
 * 于是通过自定义一个空 tabBar 的方式隐藏
 */
Component({
  data: {},
  methods: {}
});

然后正常编译即可,搞定收工~

 

标签:支付宝,TabBar,自定义,程序,tabBar,hideTabBar
From: https://www.cnblogs.com/wisewrong/p/17417070.html

相关文章

  • Springboot集成支付宝沙箱支付补充版本(退款功能)
    接上一次讲解:B站视频讲解:https://www.bilibili.com/video/BV1w44y1379q/这次的讲解涉及到完整的支付流程,大家请仔细查看!包括:支付宝沙箱支付+异步通知+退款功能正式版本的sdk通用版本SDK文档:https://opendocs.alipay.com/open/02np94<dependency><groupId>com.alipay.sdk......
  • 支付宝小程序排名优化指南——提高bao光率与关注度
       支付宝小程序的排名是由多个因素决定的,包括曝光率、关注度、用户活跃度等。以下是一些提高支付宝小程序曝光率和关注度的方法。填写完整的小程序信息:完整的小程序信息包括小程序名称、标题、简介、图标、分类、标签等,要尽量补充完整,有助于搜索引擎搜索,提高曝光率和发现度......
  • 支付宝APP支付(java后台版)
    ​本实例是基于springBoot框架编写  一、流程步骤      1.执行流程        当手机端app在支付页面时,调起服务端创建订单(自己公司业务接口)接口,后台把需要调起支付宝支付的参数返回给手机端,手机端得到参数后,调起支付宝支付环境支付,完成支付后后会调异......
  • iOS UITabBarController 典型应用
    -(BOOL)application:(UIApplication*)applicationdidFinishLaunchingWithOptions:(NSDictionary*)launchOptions{self.window=[[UIWindowalloc]initWithFrame:[[UIScreenmainScreen]bounds]];//Overridepointforcustomizationafterapplicationlau......
  • 支付宝支持给微信好友转账?
    阅读本文大概需要1.69分钟。最近看到不少人在说支付宝支持给微信或者QQ好友转账了,有的还说是不是微信支付宝互联互通了。。仔细一看,才发现,支付宝的新操作,充其量就是拿微信当作一个传声筒。简单说就是类似一个专属红包或者电子支票,把钱转进去之后生成一个专属二维码,微信发送,别人......
  • 支付宝小程序 | 获取网络状态
    参考文档:https://opendocs.alipay.com/open/025653https://opendocs.alipay.com/mini/api/network-status/***获取网络状态*@returnnetworkAvailable*@returnnetworkType*/exportconstgetNetworkType=async()=>{const{networkAvailable,networkTy......
  • 支付宝沙箱支付-zfbsxzf
    title:支付宝沙箱支付date:2022-03-0313:55:15.281updated:2022-03-1016:00:42.331url:https://www.yby6.com/archives/zfbsxzfcategories:-支付宝tags:前言基于易课堂编写的流程支付宝沙箱配置与使用申请支付宝沙箱开发文档:https://docs.open.alipay.com......
  • 支付宝余利宝升级:可直接消费、自动还款
    支付宝引入的余额宝可以说是一款里程碑式的理财产品,即便是没有任何理财知识、经验的普通用户,也可以通过它入门并让闲散的资金获得一定收益。更方便的是,余额宝里的钱不但能生钱,还可以随时转入转出,随时消费支付,还个花呗也没问题,比闲置在余额强太多了(所以才叫余额宝嘛)。其实,支付宝里......
  • uniapp app端内嵌webview对接支付宝支付
    //app支付constappRequestPayment=(orderInfo:string)=>{uni.navigateTo({url:'跳转的路径?one='+encodeURIComponent(JSON.stringify(orderInfo))})}ViewCode<viewclass="page"><web-view:src="state.navU......
  • 【HarmonyOS】【JS】Tabs如何设置区分TabBar和TabContent的分割线不显示
    【关键字】Tabs,分割线 【问题描述】使用JS开发HarmonyOS应用时,使用Tabs组件,默认自带TabBar和TabContent的蓝色分割线,由于蓝色分割线样式不可设置,若不想要此蓝色分割线,如何去除蓝色分割线? 【问题分析】1、若JS使用Tabs,蓝色分割线为组件自带样式,暂不支持属性支持显示与隐藏......