原生tabbar的拦截 v1.4.8+

说明

此功能是使用 uni-hold-tabbar原生tabbar的拦截 - 图1 垫脚片完成的,点击这里查阅API原生tabbar的拦截 - 图2

tabbar的拦截

在项目中,我们可能使用到官方提供的原生 tabbar,他提供的api很少,甚至不能愉快的拦截(一顿瞎几把吹)。所以才搞了个垫脚片。在路由插件中使用很简单,你可以声明开启拦截还是关闭拦截。其实路由插件有自动识别是否包含原生tabbar,做出相应的对策。当然你设置当前开关也是可以的!看操作….

  1. const router = new Router({
  2. APP:{
  3. holdTabbar:false //默认是true
  4. },
  5. routes:[
  6. // ....
  7. ]
  8. });

很简单,通过配置 holdTabbar 来强制关闭tabbar拦截。告诉路由tabbar拦截不要你处理了,我自己搞的定!此时666扣起来!!!

相关api的重写

如果你的项目中没有在tabbar页面中使用到 chooseLocation/openLocation 这两个api,则你可以把 rewriteFun 设置为false。路由插件默认是对这两个api进行重写的,原生tabbar拦截器会阻碍这两个api,所以进行了重写。

  1. const router = new Router({
  2. APP:{
  3. rewriteFun:false //默认是true
  4. },
  5. routes:[
  6. // ....
  7. ]
  8. });

手动处理遗漏的拦截

它关联的东西很多,配合页面出栈进栈,chooseLocation/openLocation 等api的监听来完成的。可能有时候你操作时,发现底部有一块点不动?恭喜您,这是一个bug。。。 想自己快点解决?那就手动来处理下吧。如果你不急! OK 莫问题。。。 github 提bug吧,放心我很快解决 飞机直达原生tabbar的拦截 - 图3

手动处理

通过路由提供的APi获取到原生tabbar拦截对象,看操作。。。

  1. const router = new Router({
  2. routes:[
  3. // ....
  4. ]
  5. });
  6. const $holdTab=router.$holdTab;
  7. $holdTab.hideHoldTab()
  8. setTimeout(()=>{
  9. $holdTab.showHoldTab()
  10. },3000)

通过路由实例提供的 getter $holdTab 获取到原生tabbar对象,然后你在看这里的API原生tabbar的拦截 - 图4,即可自行操作。如实在不行去github提bug。