uni-app实现点击底部导航tabbar跳转页面后隐藏tabbar

灰太狼 2023-02-16 15:27 87阅读 0赞

现在有这样一个需求：

就是点击记一笔然后直接进入新的页面，不包含底部tabbar

![20200610133546676.png][]

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzMxMDAxMDYx_size_16_color_FFFFFF_t_70][]

在tabBar中没有这个直接navigateTo跳转的

借鉴网上很多方法在小程序效果不太可

查找uni-app的api,他有提供tarBar显示隐藏的方法

那我们可以直接在需要隐藏tabBar页面中去控制

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzMxMDAxMDYx_size_16_color_FFFFFF_t_70 1][]

onShow() {
    		    uni.hideTabBar()
    		},
    		onHide(){
    			uni.showTabBar()
    		}

即可完成

[20200610133546676.png]: https://img-blog.csdnimg.cn/20200610133546676.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzMxMDAxMDYx_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20200610133648866.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzMxMDAxMDYx,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzMxMDAxMDYx_size_16_color_FFFFFF_t_70 1]: https://img-blog.csdnimg.cn/20200610133950586.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzMxMDAxMDYx,size_16,color_FFFFFF,t_70

发表评论取消回复

表情：

评论列表（有 0 条评论，87人围观）

还没有评论，来说两句吧...

相关阅读

相关 vue----页面跳转隐藏tabbar

在路由配置页面 import Vue from 'vue' import VueRouter from 'vue-router' import {

喜欢ヅ旅行/ 2023年05月30日 08:42/ 0 赞/ 77 阅读

相关 flutter 实现底部tabBar 页面跳转效果

效果图如下：点击底部tabBar切换页面 ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_a

系统管理员/ 2023年02月18日 09:32/ 0 赞/ 94 阅读

相关 uniapp设置tabBar后，页面底部有留白。

manifest.json>app启动页配置>等待首页渲染完毕后再关闭Splash图，打勾解决。应该是uniapp启动时候渲染页面的bug。 ![在这里插入图片描述][

偏执的太偏执、/ 2023年02月17日 05:12/ 0 赞/ 90 阅读

相关 uni-app实现点击底部导航tabbar跳转页面后隐藏tabbar

现在有这样一个需求：就是点击记一笔然后直接进入新的页面，不包含底部tabbar ![20200610133546676.png][] ![watermark_type_

灰太狼/ 2023年02月16日 15:27/ 0 赞/ 88 阅读

相关 uni-app 底部导航栏tabBar

1. 效果图 ![最终效果][20200523150813300.gif_pic_center] 2. 实现在pages中添加页面.vue 在pa

绝地灬酷狼/ 2023年02月12日 05:41/ 0 赞/ 118 阅读

相关点击tabbar刷新页面

.h文件 import <UIKit/UIKit.h> @interface TabbarRootViewController : UITabBarCo

傷城~/ 2022年08月22日 13:26/ 0 赞/ 304 阅读

相关微信小程序点击按钮跳转至tabbar页面

在具有tabbar的页面中，倘若你要实现tabbar中的页面跳转（并不是跳转到此tabbar页面外的其他页面），使用wx.redirectTo或wx.navigateTo是实现

Love The Way You Lie/ 2021年09月16日 14:42/ 0 赞/ 842 阅读

相关 uniapp之tabBar/页面切换

1.uniapp目录结构 ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6L

╰半夏微凉°/ 2021年09月13日 15:24/ 0 赞/ 5487 阅读

相关 uniapp 导航栏tabBar

注意: (1)当设置导航栏在顶部,即position为top时,只能配置文字,不能配置图标 (2)当设置导航栏在顶部时,仅微信有效 (3)图标不

超、凢脫俗/ 2021年07月24日 23:15/ 0 赞/ 907 阅读

相关微信小程序 tabBar底部/顶部导航栏跳转

api->界面->tabBar 指南->基础能力->自定义tabBar 底部导航栏 (1)最少2个页面,最多5个页面 (2)使

阳光穿透心脏的1/2处/ 2021年07月24日 11:41/ 0 赞/ 902 阅读