需求背景
在某个子页面点击左上角返回按钮直接返回到首页。
说明
当用户进行以下操作时,会触发该函数:
1、Android 实体返回键 (from = backbutton)
2、顶部导航栏左边的返回按钮 (from = backbutton)
3、返回 API,即 uni.navigateBack() (from = navigateBack)
注意事项
1、只有在该函数中返回值为 true 时,才表示不执行默认的返回,自行处理此时的业务逻辑。
2、当不阻止页面返回却直接调用页面路由相关接口(如:uni.switchTab)时,可能会导致页面显示异常,可以通过延迟调用路由相关接口解决。
3、不返回或返回其它值,均会执行默认的返回行为。
4、H5 平台,顶部导航栏返回按钮支持 onBackPress(),浏览器默认返回按键及Android手机实体返回键不支持 onBackPress()
5、暂不支持直接在自定义组件中配置该函数,目前只能是在页面中来处理。
错误实现
onBackPress(e) {
if (e.from == 'backbutton') {
uni.navigateBack({
delta: 100
})
}
return true
},
由于 uni.navigateBack() 同样会触发 onBackPress 函数。因此在 onBackPress 中直接调用 uni.navigateBack() 并始终返回 true 会引发死循环。
这就是导致重写 onBackPress 方法不生效的罪魁祸首,然而也没有任何错误提示。
正确实现
onBackPress(options) {
if (options.from === 'navigateBack') {
return false
}
uni.navigateBack({
delta: 100
})
return true
}
需要根据 onBackPress 的回调对象中的 from 值来做处理,当来源是 navigateBack 时,返回 false。