微信小程序 左上角返回按钮,返回到指定页面
背景描述:
在项目中开发,从首页/其他页面 =》登录页=》某列表页,该列表在按返回按钮时,要返回到首页。
从首页/其他页面跳到登录页用的是,wx.reLaunch() ;
登录页成功之后要跳到指定的某列表页用的是:wx.navigateTo ();
解决思路:
在此之前先了解下小程序页面跳转的相关点:
| 跳转方式 | 说明 | 其他 |
|
wx.navigateTo(Object) |
用于保留当前页面、跳转到应用内的某个页面,使用 wx.navigateBack可以返回到原页面 |
新页面入栈 |
|
wx.redirectTo(Object) |
用于关闭当前页面,跳转到应用内的某个页面 | 当前页面出栈,新页面入栈 |
|
wx.switchTab(Object) |
跳转到 tabBar页面,并关闭其他所有非 tabBar 页面 |
页面不断出栈,直到目标返回页,新页面入栈 |
|
wx.navigateBack(Object) |
用于关闭当前页面,并返回上一页面或多级页面,开发者可通过 getCurrentPages() 获取当前的页面栈,决定需要返回几层则设置对象的delta属性即可 |
页面全部出栈,只留下新的 Tab 页面 |
| wx.reLaunch(Object) | 关闭所有页面,打开到应用内的某个页面,返回的时候跳到首页 | 页面全部出栈,只留下新的页面 |
所以可以了解到,从登录页跳转到其他页面(非首页,非Tab页),只能用wx.navigateTo(),因为用wx.redirectTo()和wx.reLaunch()跳转到其他页面,其他页面会成为首页,顶部没有返回按钮。
但是用navigateTo()之后,会有个问题,就是跳转某页面,再从某页面返回就会返回到登录页,这是不想看到的。所以就会有两种方法可以考虑:
1、跳转之后,从页面栈删除登录页。(但是试了之后,不可行,删了之后,后面返回还是可以返回到登录页)
2、在列表页返回到首页时,做特殊处理:
先了解下场景是这样的,从首页某个入口进去发现没有用户登录信息,那么就跳转到登录页,如果有用户登录信息了,就不用跳到登录页。
所以在列表页返回时,需要做一下判断,页面栈的首页是不是就是登录页,如果是登录页,就用wx.redirectTo()返回到首页;
如果不是,不用做处理。
list.wxml
//监听页面卸载 onUnload:function(){ let pages = getCurrentPages(); let firstPage = pages[0]?.route; if(firstPage.includes('login')){ //有没有跳转到登录页过,有的话,才需要跳过登录页,返回首页 wx.redirectTo({ url: 'url', }) } }
以上解决参考来源:https://blog.csdn.net/qq_37273844/article/details/107666939 感谢这位作者提供的一些思路。

浙公网安备 33010602011771号