微信小程序登录页左上角的home图标如何隐藏?wx.hideHomeButton()不生效?

2023-05-12,,

在做微信小程序时,我们一般都会在app.js中去判断当前用户是否已经登录,如果已经登录,会直接跳转到小程序的首页。如果未登录那么直接跳转登录页。

此时我们需要把首页首页作为微信小程序的pages列表中的第一个页面,这样可以减少打开小程序的时候闪过其他页面的频率,用户体验感会相对较好。

但是我们会发现这样的话,跳转到登录页面之后,登录页面左上角会出现一个 home 图标,但是我们已经使用了wx.reLaunch(关闭所有页面打开登录页面)跳转登录页面,为什么还会出现这个问题呢?

这是由于,我们使用wx.reLaunch时,最后跳转的页面会成为页面栈的最深的一个页面,因此会出现 home 图标,方便用户返回首页。

那此时登录页面我们是不需要返回首页的,有如下解决方案:

在app.js中,在onshow方法中使用wx.hideHomeButton() 来隐藏按钮。

调用完wx.hideHomeButton() 后,我们发现在微信开发工具中已经生效了,但是当我们使用手机真机预览的时候发现并没有生效。

因此我们最终解决方案如下:

// app.js

App({
onLaunch() {
if(!wx.getStorageSync('token')){
setTimeout(()=>{
wx.reLaunch({
url:"/pages/login/login"
})
},100)
}
}, // 应用进入前台
onShow() {
setTimeout(() => { // 使用延时,避免隐藏不生效
wx.hideHomeButton()
}, 200);
},

微信小程序登录页左上角的home图标如何隐藏?wx.hideHomeButton()不生效?的相关教程结束。

《微信小程序登录页左上角的home图标如何隐藏?wx.hideHomeButton()不生效?.doc》

下载本文的Word格式文档,以方便收藏与打印。