微信小程序优化多次跳转后卡顿问题

一、微信小程序多次跳转会产生卡顿的原理

通过wx.navigateTo 跳转，都会出现保留当前页面，打开新的页面机制。

wx.navigateTo不会将旧页面出栈，会将新页面入栈(栈内元素个数增加，栈内元素5个时，不能再跳转)。手机性能好点，可能10次左右才会导致小程序跳转卡顿崩溃。

二、解决方法：

1、减少wx.navigateTo的使用，看看能不能用wx.redirectTo代替其跳转。

2、如果已经有缓存栈内，是否可以直接将跳转新的页面（有缓存栈），相当于wx.navigateBack返回缓存栈页面。然后修改数据刷新数据即可。

可以将跳转方法统一封装一下如下操作：

//统一跳转  go_to('navigateTo','pages/index/index','keyword=张三')
function go_to(type,url,parameter){let pages = getCurrentPages();if(pages[pages.length-1].route == url){wx.showToast({title: '已在当前页面~',icon:'none',duration: 1500}); return false;}for(let index in pages){   //若存在缓存页面，返回当前页面，parameter不为空时，将会更改返回页面的setdata值（注意：只能改变一个值）if(pages[index].route == url){index = pages.length-1-index;if(index ==0||index==-1){index = 1;}if(parameter!=undefined){let item_box = parameter.split("=");pages[index].setData({[item_box[0]]:item_box[1]});}wx.navigateBack({delta: index});return false;}}parameter!=undefined?url = '/'+url+'?'+parameter:url = '/'+url;switch (type) {case 'navigateTo':wx.navigateTo({url:url});break;case 'redirectTo':wx.redirectTo({url:url});break;case 'switchTab':wx.switchTab({url:url});break;case 'reLaunch':wx.reLaunch({url:url});break;default:wx.navigateTo({url:url});break;}
}

然后在相应的位置引入跳转即可。同一个页面跳转到同一个页面，建议直接刷新数据即可，封装的方法里面未做处理。

三、方法简单通用，调用即可。

微信小程序优化多次跳转后卡顿问题相关推荐

微信小程序使用tensorflow做人脸识别检测卡顿的部分解决思路
1.tf.tidy() 防止内存溢出,特别是在ios上 return tf.tidy(() => {const raw_im = xxxreturn raw_im; }); 2.tf.dispo ...
微信小程序实现锚点跳转
微信小程序实现锚点跳转 1.先上效果图,看看是不是你想要的. 2.主要用到的微信小程序的scroll-view 组件实现该效果.核心主要是使用scroll-into-view属性跳转对应的标签页和标签 ...
微信小程序两个页面跳转，传值
微信小程序两个页面跳转,传值在小程序界面,需要点击后跳转界面并且传递一个值. 具体实现如下:首先在wxml界面需要绑定事件,绑定需要传的值 a.wxml `<view bindtap=&quo ...
如何实现两个微信小程序之间的切换跳转
如何实现两个微信小程序之间的切换跳转 wx.navigateToMiniProgram({appId: '***************', //跳转目标小程序的appIdpath: '/pages/ ...
Prepack详细介绍及微信小程序优化的新思路
作者介绍:雪婧,美团点评点餐团队成员. 前言 Prepack前几个月刚出来的时候已经得到了前端界的大范围关注,而在不久之后又逐渐退出了人们的视线.此时这篇文章出来可能显得有些滞后,个人还是比较看好它未 ...
微信小程序路径带参数跳转
微信小程序路径带参数跳转 release_con: function () {console.log(this.data.cateid)wx.navigateTo({url: '/pages/rele ...
微信小程序云开发之用户输入数据后excel表格导出升级版
大家好,我是csdn的小博主lqj_本人,最近在哔哩哔哩开始上传我的制作微信小程序的详细流程,大家可以关注一下哔哩哔哩:小淼前端本次程序的详细视频教程已上传至哔哩哔哩: 腾讯云开发小程序之用户输入数 ...
微信小程序云函数中的数据处理后返回
微信小程序云函数中的数据处理后返回本文主要演示的是,在微信云函数中调用数据库后,如何对获取的内容在云函数内处理后返回. 主函数 exports.main = async (event, contex ...
微信小程序解决内层页面分享出去后用户无法通过分享页面返回首页问题
微信小程序解决内层页面分享出去后用户无法通过分享页面返回首页问题本质就是设置一个变量isshare来判断是否是分享页面中进入的 data设置 isshare: 0,//不是分享页面进入 js o ...

微信小程序优化多次跳转后卡顿问题

微信小程序优化多次跳转后卡顿问题相关推荐

最新文章

热门文章