微信小程序 --- 使用wx.redirectTo(OBJECT)跳转页面安卓返回按钮异常问题(监听安卓返回键操作,监听小程序左上角返回按钮)

先看看官方文档对wx.navigateBack的使用解释

wx.navigateBack(OBJECT)

关闭当前页面,返回上一页面或多级页面。可通过 getCurrentPages() 获取当前的页面栈,决定需要返回几层。
OBJECT 参数说明:
参数 类型 默认值 说明
delta Number 1 返回的页面数,如果 delta 大于现有页面数,则返回到首页。

wx.redirectTo(OBJECT)

wx.redirectTo(OBJECT) 关闭当前页面,跳转到应用内的某个页面。

wx.navigateTo(OBJECT)

保留当前页面,跳转到应用内的某个页面,使用wx.navigateBack可以返回到原页面。

那么问题是,官方左上角返回按钮,和安卓返回按钮&&IOS左滑,或者说是顶部区域自定义自己写返回按钮,那通通都是返回上一级,当然自定义返回的按钮你可以利用wx.navigateBack返回更多的页面层级,但你是无法控制比方安卓返回键的操作的,它默认就是返回一级,那要怎么解决系统自带返回按钮默认只返回上一级的问题?请往下看:

如何自定义顶部区域?点这里
这里写图片描述

首先第一个,刚才一直说返回上一级上一级的,返回的是什么?没错!是页面。那么是否可以从页面上面下手找到解决方案?答案是可以的,就是页面的生命周期,先看看都有什么
这里写图片描述

页面进来的时候 都会加载onLoad,onShow,onReady,剩下的两个onHide,onUnload是在页面隐藏和页面卸载的时候加载,这两个是有区别的,onHide是指页面仍然存留在页面栈中,而onUnload已经在页面栈移除掉了,完全不存在,页面栈是在什么时候存进来的? 一般默认都是使用wx.navigateTo(OBJECT),因为返回的时候要返回上一级所以需要保留页面,这个时候也是将页面路径存进页面栈的时候,而使用wx.navigateBack移除一级或者多级页面的时候,跳进指定路径会生成一个新的路径存进去页面栈中,所以就会出现返回键只返回一层的时候,页面出现要返回两次才能返回目标页面上一层的情况,而onUnload在每次页面跳转到另一个页面的时候都会触发这时候就可以利用它去判断,安卓返回键是否有按下进行返回上一级操作的条件了,因为你不可能说每次按都这样,因为页面需求关系,可能有多种条件触发,所以你还需要一个东西,就是根据页面栈的数量去判断,利用getCurrentPages()就可以得到页面栈的数量,示例代码如下:

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {
    if (getCurrentPages().length == 3) {
      wx.navigateBack({
        delta: 1
      })
    }
  },

以上就是本文全部内容,希望帮助到你

发布了102 篇原创文章 · 获赞 75 · 访问量 44万+

猜你喜欢

转载自blog.csdn.net/sinat_19327991/article/details/81584037