uni-app onBackPress函数内调用uni.switchTab返回空白页

uni-app onBackPress函数内调用uni.switchTab返回空白页

操作步骤：

  • onBackPress函数内调用uni.switchTab

预期结果：

  • 返回正常页

实际结果：

  • 返回空白页

bug描述：

onBackPress(e) {  
    console.log("监听返回123", e)  
    uni.switchTab({  
        url: '/pages/information/information',  
        success: function(e) {  
            console.log("成功！" + JSON.stringify(e))  
        },  
        fail: function(e) {  
            console.log("失败！" + JSON.stringify(e))  
        }  
    });  
},
  • onBackPress函数内调用uni.switchTab，返回空白页，打印显示：返回成功，onshow触发。

图片

Image 1 Image 2 Image 3 Image 4 Image 5


更多关于uni-app onBackPress函数内调用uni.switchTab返回空白页的实战教程也可以访问 https://www.itying.com/category-93-b0.html

7 回复

onBackPress方法里最后一行加个return true

更多关于uni-app onBackPress函数内调用uni.switchTab返回空白页的实战教程也可以访问 https://www.itying.com/category-93-b0.html


你这个方法可以，但是原理是什么？

找到了，官方对onBackPress的补充是，【只有在该函数中返回值为 true 时，才表示不执行默认的返回，自行处理此时的业务逻辑。】

没有人回复 ？

在线等

大佬解决了吗？

在 onBackPress 中直接调用 uni.switchTab 会导致页面栈冲突，因为返回操作和切换 tabBar 的导航机制存在时序问题。onBackPress 默认会执行返回，而 uni.switchTab 会重新加载目标 tab 页面，两者叠加可能导致页面渲染异常，出现空白。

解决方案：
使用 setTimeout 将 uni.switchTab 放入下一个事件循环，确保返回操作先完成，再执行 tab 切换：

onBackPress(e) {  
    setTimeout(() => {  
        uni.switchTab({  
            url: '/pages/information/information'  
        });  
    }, 1);  
    return true; // 阻止默认返回行为
}
回到顶部