QQ咨询 官方微信

添加微信好友

官方小程序

百度小程序

微信小程序

头条小程序

关于我们

小程序

首页 > 小程序 >

小程序页面栈溢出造成无法点击问题解决

 admin  2023-05-19 11:46:13
因为小程序为了性能,都有个页面栈的说法,一般都是10层,超过这个之后就会无法点击,官方推荐的路由方式,都有各自的问题。例
  1. navigateTo  保留当前页面,跳转到应用内的某个页面(联系点击10次就会栈溢出) 
  2. redirectTo  关闭当前页面,跳转到应用内的某个页面(即无法返回) 
  3. switchTab  跳转到 tabBar 页面,并关闭其他所有非 tabBar页面(tabbar之间无法传参,让人抓狂) 
  4. navigateBack 关闭当前页面,返回上一页面或多级页面。(如果上一页页面不存在就会失效) 
  5. reLaunch  关闭所有页面,打开应用内的某个页面。(无法返回) 
解决栈溢出,官方肯定首推switchTab,但是switchTab有个致命缺点就是互相之间无法传参。redirectTo前进之后无法后退,reLaunch也是同样问题,所以最理想的就是navigateTo。

如何解决navigateTo栈溢出问题?

一般我们的小程序如果页面很多,并且有明显的分类,可以考虑switchTab,或者自定义tabbar,才有switchTab和navigateTo结合的办法。通过官方提供的getCurrentPages()方法获取当前所有栈,如果你要访问的页面已经存在在栈里了,就直接navigateBack()过去,

  1. getCurrentPages() 函数用于获取当前页面栈的实例,以数组形式按栈的顺序给出,第一个元素为首页,最后一个元素为当前页面。 
虽然这种方式也是无法完全避免,但是却能大大降低这种情况。

使用方法:
1、在公共函数库封装一个js方法
  1. //自动判断栈 
  2. function goto(url){ 
  3.     var pages = getCurrentPages(); 
  4.     let dlt = "";//深度 
  5.     var len = pages.length; 
  6.     for (let i = 0; i < len; i++) { 
  7.         if (pages[i].route == url) { 
  8.             dlt = i + 1; //目标页在栈中的位置 
  9.             break
  10.         } 
  11.     } 
  12.     if(!dlt){ 
  13.         if (len < 10) { 
  14.             tt.navigateTo({ 
  15.                 url: '/'+ url 
  16.             }); 
  17.         } else { 
  18.             tt.redirectTo({ 
  19.                 url:  '/'+ url 
  20.             }) 
  21.         } 
  22.     }else
  23.         tt.navigateBack({ 
  24.             delta: len - dlt 
  25.         }); 
  26.     } 
改法自动帮你判断当前url是否已经入栈,如果入栈直接返回过去,如果没有则入栈,如果超过10则用redirectTo方法跳转,

2,在需要使用的js里边 调用
  1. _goCourse: function () { 
  2.     var curURL = 'pages/course/list'
  3.     common.goto(curURL); 
  4. }, 

注意:如果你是用的<navigator url=''></navigator> 这种方式,则无法避免,所以尽量别用这个



¥ 打赏
×
如果您觉得文章帮助了您就打赏一下吧
非常感谢你的打赏,我们将继续分享更多优质内容,让我们一起创建更加美好的网络世界!

支付宝扫一扫打赏

微信扫一扫打赏

本文《小程序页面栈溢出造成无法点击问题解决》发布于石头博客文章,作者:admin,如若转载,请注明出处:https://www.pweb123.com/xiaocheng/946.html,否则禁止转载,谢谢配合!

文章点评

我来说两句 已有0条评论
点击图片更换

添加微信好友

添加微信好友

微信小程序

百度小程序