自定义导航栏(custom-nav-bar)的返回事件被执行了两次(页面回调 + 组件默认 navigateBack),导致页面栈多弹一层,出现“返回跳过中间页且返回到的页面点不动”。
1. 为什么会出现?
- 页面写了 @leftClick="goBack",点击返回会先执行页面的 goBack()(一次 navigateBack)。
- 组件内部又默认执行一次 uni.navigateBack()。
- 同一次点击触发两次返回,因此会出现“从详情页返回直接跳过中间页”的现象。
这类问题的本质是:事件回调 + 组件默认行为同时存在且没有互斥。
2. 思路
- 第一步:用“页面栈”解释现象
想要detail -> progress,但实际 detail -> mine,说明 返回多弹了一层,典型就是“调用了两次 navigateBack / redirectTo / reLaunch”。
-
第二步:找所有可能触发返回的入口
在 uni-app/Vue 里,返回可能来自:
- 页面方法(goBack())
- 组件默认行为(例如自定义导航栏内部封装了 navigateBack)
- 系统导航(若开启原生导航)
- 生命周期触发跳转(如 onShow/onLoad 里 reLaunch)
-
第三步:确认是否“双触发”
一旦看到组件里既 emit('leftClick') 又自己 navigateBack(),并且页面也写 @leftClick="goBack",基本就能断定是双触发。
- 第四步:修复原则
- 组件提供默认行为没问题,但必须给调用方“接管”的能力(开关/回调返回值/阻止默认行为)。
- 全局组件(导航栏)一旦出 bug,会影响全站,修复要可控、可迁移、可批量落地(用 autoBack 就属于可控开关)。