关于uni-app中隐藏底部导航栏uni.hideTabbar()的使用

前言：对于自定义导航栏，以及在底部对应页面需要显示自定义弹框从而隐藏底部的情况。

首先我们来看官网介绍：uni.setTabBarItem(OBJECT) | uni-app官网

 官网介绍结束，但官网没有介绍在哪调用以及不同地方调用会不会出错的问题。

使用方式：

情况一：如果pages里面的第一个页面是底部导航栏页面的，在App.vue的onShow生命周期调用即可

 

情况二：如果pages里面的第一个页面不是底部导航栏页面的，需要在对应页面的onShow调用，当然如果你们觉得在App.vue加入也行，但运行小程序可能会报"errMsg": "hideTabBar:fail not TabBar page"错误,意思就是“隐藏失败，不在导航栏页面”，如下：

情况三：如果只是编译成小程序，可以在pages的tabbar配置里加上了"costom":true的配置，此配置在小程序生效，注意：使用此配置，自定义底部时无需调用uni.hideTabbar()，因为调用会报"errMsg": "hideTabBar:fail customTabBar"错误，意思是"隐藏失败，tabbar是自定义的"，如下

 

 针对第二种情况，如果大家不想每个页面都写uni.hideTabbar()的话，大家使用条件编译，将情况二和三结合起来使用，就是在配置加上"costom":true，然后再在App.vue的onShow里面写个条件编译，不是运行在小程序时再加入代码uni.hideTabbar()，如下：

Tips

1、如果使用 uni.switchTab 跳转后 uni.hideTabBar()不生效的，可以尝试在uni.switchTab回调方法里面调用 uni.hideTabBar 方法

uni.switchTab({
    url:'xxx',
    success:res=>{
        uni.hideTabBar()
    }
})

2、如果在页面中显示弹框要隐藏底部uni.hideTabBar() 和 uni.showTabBar()不生效的，可以尝试在nextTick中使用，或加个延迟

以上就是uni.hideTabBar的使用及注意事项，如有错误，欢迎各位大佬指出并补充。