uni app 实现自定义tabbar 及 后续 取消默认 左滑返回事件

2,528 阅读1分钟

工作中需求要写一个样式比较好看的tabbar,其中遇到的挺有趣的问题。

一、自定义tabbar

  • 占位:现在没空详细写过程,主要思路以下:
    将需要展示的页面 + tabbar写成一个页面展示,tabbar的切换,使用vuex进行状态管理,其中需要展示切换的页面被当作了组件使用,但此时uniapp对组件会有默认的左滑事件,作为首屏的展示页面会有左滑效果,左滑之后白屏无法切回。对用户使用造成影响。

二、取消左滑事件

解决办法如下:

  • 安卓:
    对于tab页面 + tabbar写成的展示页面,可以通过uniapp提供的监听页面切换接口onBackPress取消。
  • IOS:
    可以在pages.json中对该展示页面的配置中添加"popGesture": "none"进行取消。