解决栈溢出,官方肯定首推switchTab,但是switchTab有个致命缺点就是互相之间无法传参。redirectTo前进之后无法后退,reLaunch也是同样问题,所以最理想的就是navigateTo。
- navigateTo 保留当前页面,跳转到应用内的某个页面(联系点击10次就会栈溢出)
- redirectTo 关闭当前页面,跳转到应用内的某个页面(即无法返回)
- switchTab 跳转到 tabBar 页面,并关闭其他所有非 tabBar页面(tabbar之间无法传参,让人抓狂)
- navigateBack 关闭当前页面,返回上一页面或多级页面。(如果上一页页面不存在就会失效)
- reLaunch 关闭所有页面,打开应用内的某个页面。(无法返回)
如何解决navigateTo栈溢出问题?
一般我们的小程序如果页面很多,并且有明显的分类,可以考虑switchTab,或者自定义tabbar,才有switchTab和navigateTo结合的办法。通过官方提供的getCurrentPages()方法获取当前所有栈,如果你要访问的页面已经存在在栈里了,就直接navigateBack()过去,
虽然这种方式也是无法完全避免,但是却能大大降低这种情况。
- getCurrentPages() 函数用于获取当前页面栈的实例,以数组形式按栈的顺序给出,第一个元素为首页,最后一个元素为当前页面。
使用方法:
1、在公共函数库封装一个js方法
改法自动帮你判断当前url是否已经入栈,如果入栈直接返回过去,如果没有则入栈,如果超过10则用redirectTo方法跳转,
- //自动判断栈
- function goto(url){
- var pages = getCurrentPages();
- let dlt = "";//深度
- var len = pages.length;
- for (let i = 0; i < len; i++) {
- if (pages[i].route == url) {
- dlt = i + 1; //目标页在栈中的位置
- break;
- }
- }
- if(!dlt){
- if (len < 10) {
- tt.navigateTo({
- url: '/'+ url
- });
- } else {
- tt.redirectTo({
- url: '/'+ url
- })
- }
- }else{
- tt.navigateBack({
- delta: len - dlt
- });
- }
- }
2,在需要使用的js里边 调用
- _goCourse: function () {
- var curURL = 'pages/course/list';
- common.goto(curURL);
- },
注意:如果你是用的<navigator url=''></navigator> 这种方式,则无法避免,所以尽量别用这个
文章点评