收藏
回答

自定义tabBar的实现方案和bug

研究了一下自定义tabbar,发现目前没有一个完美的实现方案。我所知道的几种方案:


方案一:.使用官方提供的自定义tabbar。部分机型会出现显示不了tabbar的bug,这个bug很严重。切换tab会有明显的延迟,  至于使用过程中有没有其他坑,我还没有踩过,但社区里面已经有人遇到过各种问题,很多截止现在官方还没有修复,不敢用。


方案二:将tabbar封装成组件或模板,在每个tab页面去引用。由于每个tab页面都是独立的Page,通过wx.redirectTo()或wx.navigateTo()来切换tab页面,会有闪屏问题。还有如果启用下拉刷新,刷新的过程中点击tabbar获取不到点击事件,无法切换tab。  而且在安卓手机上,整个页面会随着手势往下滑


方案三:将每个tab页面封装成组件,在一个页面中通过隐藏和显示对应的组件来实现切换tab页面的效果。由于是一个页面,没有了方案二的闪屏问题,但是Page和Component之间事件的交互又比较麻烦,增加了代码的复杂度。启用下拉刷新,也会遇到方案二同样的问题


希望官方能尽早解决方案一中的bug


最后一次编辑于  07-19  (未经腾讯允许,不得转载)
邀请回答
复制链接收藏关注问题回答

6 个回答

  • 相信自己
    相信自己
    07-19

    同问  发开中也遇到类似的问题 试了好几种方法都是出现上面的问题   楼主找到完美的方法了吗

    07-19
    赞同
    回复 5
    • ww
      ww
      07-19
      可用采用方案三,安卓手机下拉刷新整个页面往下滑动,这个问题规避的方法是自定义下拉刷新,但是稳定性不好
      07-19
      赞同
      回复
    • ww
      ww
      07-19
      方案一,把官方提供的custom-tab-bar的cover-view,cover-image换成view和image,可以显示出来,但是下拉刷新的时候,不能获取切换tab的点击事件
      07-19
      赞同
      回复
    • 相信自己
      相信自己
      07-22回复ww
      大佬 用方案三 难度是不是会比较大啊 还有上拉和下拉的兼容不更难搞
      07-22
      赞同
      回复
    • ww
      ww
      07-23回复相信自己
      是麻烦一些,自定义的下拉刷新可能会遇到一些坑,不如官方的好用
      07-23
      赞同
      回复
    • 相信自己
      相信自己
      08-01
      是啊 大佬有什么好的案例出来看下吗
      08-01
      赞同
      回复