微信小程序返回多级页面的实现方法
微信小程序返回多级页面的实现方法
微信小程序开发中，返回上一页是很普遍的操作，最常见的是点击手机的返回键和点击自定义的按钮返回上一页这两种情况。点击手机的返回键我们不需要做处理，如果是自定义按钮实现返回效果，就要调用微信提供的API：
wx.navigateBack(OBJECT)
也可以通过 wx.navigateBack 方法实现返回多级页面，只要设置 delta 的值就可以：
//在C页面内 navigateBack，将返回A页面，delta = 1 时与 wx.navigateBack() 效果一致
wx.navigateBack({
delta: 2
})
但是有些时候，我们需要实现点击手机的返回键，也返回上两页或者多页，这样子就不能直接用上面的方法来处理了。我用过下面的两种方法来实现：
方法一：在页面C的 onUnload 方法里面调用 wx.navigateBack() ，这样可以实现返回到页面A，不过会有个问题，如果把页面C分享到微信聊天会话里面，然后关闭小程序，再从聊天会话打开页面C，还会调用 wx.navigateBack() 方法，并且报这个异常：
WAService.js:9 navigateBack with an unexist webviewId 0
方法二：另一种方法是在页面B的 onShow 方法中调用 wx.navigateBack() 实现返回 ，这样就可以避免方法一中出现的问题。实现的思路如下：
① 在页面C的 onUnload 方法里面判断是否可以返回前n页，通过 getCurrentPages() 方法可以获取当前的页面栈，根据页面栈的长度判断可以返回的层数，并且可以给所有页面的 data 设置参数，这里以返回上两页为例：
//这里是页面C的 onUnload 方法
onUnload: function() {
var that = this
//判断页面栈里面的页面数是否大于2
if(getCurrentPages().length > 2) {
//获取页面栈
let pages = getCurrentPages()
//给上一个页面设置状态
let curPage = pages[pages.length - 2];
let data = curPage.data;
curPage.setData({'isBack': true});
}
},
② 在页面B的 onShow 方法里面根据 isBack 的值，判断是否调用 wx.navigateBack() ：
//这里是页面B的 onShow 方法
onShow: function() {
var that = this
//如果 isBack 为 true，就返回上一页
if(that.data.isBack) {
wx.navigateBack()
}
},
方法一和方法二都不是直接从页面C到页面A，都是要先经过页面B，所以会出现页面B闪一下的情况，大家如果有更好的方法可以告诉我。
如有疑问请留言或者到本站社区交流讨论，感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！
相关文章
这篇文章主要介绍了微信小程序 底部导航栏目开发资料的相关资料，微信小程序底部想要有一个漂亮的导航栏目，不知道怎么制作，于是百度找到了本篇文章，分享给大家,需要的朋友可以参考下2016-12-12
这篇文章主要介绍了微信小程序 安全包括（框架、功能模块、账户使用）详解的相关资料,需要的朋友可以参考下2017-01-01
这篇文章主要介绍了浅谈JavaScript浅拷贝和深拷贝，javascript中的对象是引用类型，在复制对象的时候就要考虑是用浅拷贝还是用深拷贝。接下来一起聊聊吧,感兴趣的小伙伴也可以参考一下2021-11-11
这篇文章主要为大家介绍了JS前端同源策略和跨域及防抖节流详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-09-09
这篇文章主要介绍了JavaScript ES新特性块级作用域，所谓的块级作用域，就是该变量只能在声明时的代码块或者子代码块中使用，使JavaScript出现了块级作用域，具体详细内容请参考下面文章内容2021-12-12
这篇文章主要介绍了JS 里为什么会有 this，文章主要从语言创造者（JS 之父的角度）来思考 this，我之前那篇讲 this 的文章是从使用者的角度写的,需要的朋友可以参考一下2021-10-10
详解微信小程序入门从这里出发（登录注册、开发工具、文件及结构介绍）
这篇文章主要介绍了微信小程序入门从这里出发（登录注册、开发工具、文件及结构介绍）,本文给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2020-07-07
这篇文章主要介绍了微信小程序 动画的简单实例的相关资料,希望通过本文能帮助到大家，需要的朋友可以参考下2017-10-10
这篇文章主要介绍了微信小程序 跳转方式总结的相关资料,需要的朋友可以参考下2017-04-04
这篇文章主要介绍了微信小程序url与token设置详解的相关资料,希望通过本文能帮助到大家解决类似问题，需要的朋友可以参考下2017-09-09
最新评论