微信小程序 空白页重定向解决办法


Posted in Javascript onJune 27, 2017

微信小程序 空白页重定向解决办法

 在刚开始的时候将小程序的入口文件直接指向tabbar 的首页,此时出现问题:二维码扫描,第一次不关闭首页,第二次进入时;不会经过onLoad过程解析scene参数;

官方中解释:tabbar跳转方式触发的生命周期是 onShow,不经过onLoad,下图:

微信小程序 空白页重定向解决办法

此时,和小伙伴讨论重定向问题时,想到用类似的方法可以做到,就立马实行:

app.json中加pages/index/index(入口文件),pages/home/home(tabbar页面主页),pages/detail/detail(详情页);pages/exclusive/exclusive

在index.js中 onLoad处理:

/**
  * 生命周期函数--监听页面加载
  */
 onLoad: function (options) {
  // 入口文件 决定进入哪个页面
  console.log('入口文件,参数scene,值detail%2C1127')
  var scene = options.scene; //扫码进入有此参数
var scene = decodeURIComponent(options.scene);
  if (scene) {
   //'scene=detail%2C1127' 分隔符, 测试时为 , 号;真机时为%2C 原因是url编码,但是使用decodeURI()解析不出来,所以走了兼容
   
   let info_arr = [];
   info_arr = scene.split(',');
   //console.log(info_arr)
   let _type = info_arr[0];
   let id = info_arr[1];
   if (_type == 'detail') {
    wx.redirectTo({ url: `../detail/detail?id=${id}`, })
   } else if (_type == 'exclusive') {
    wx.redirectTo({ url: `../exclusive/exclusive?id=${id}`, })
   }
  }else{
   wx.switchTab({
    url: '../home/home',
   })
  }
 },

此时,完美解决 从 扫码-->home-->detail;再次扫码-->home 不能到-->detail的问题;

此时 扫码-->index(redirectTo)-->detail;再次扫码-->index(redirectTo)-->detail的问题;越过home页面

由于home页面有大量的请求,不适宜用redirectTo;所以此方法算是折中的选择了

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
javascript 节点遍历函数
Mar 28 Javascript
xml转json的js代码
Aug 28 Javascript
jquery 获取dom固定元素 添加样式的简单实例
Feb 04 Javascript
完美兼容各大浏览器获取HTTP_REFERER方法总结
Jun 24 Javascript
5款JavaScript代码压缩工具推荐
Jul 07 Javascript
js实现获取焦点后光标在字符串后
Sep 17 Javascript
js实现带关闭按钮始终显示在网页最底部工具条的方法
Mar 02 Javascript
值得分享的bootstrap table实例
Sep 22 Javascript
详解浏览器渲染页面过程
Feb 09 Javascript
浅谈node中的exports与module.exports的关系
Aug 01 Javascript
EasyUI框架 使用Ajax提交注册信息的实现代码
Sep 27 Javascript
JS实现的贪吃蛇游戏案例详解
May 01 Javascript
ionic 自定义弹框效果
Jun 27 #Javascript
js脚本编写简单刷票投票系统
Jun 27 #Javascript
详解Vue.js搭建路由报错 router.map is not a function
Jun 27 #Javascript
详解vue.js的事件处理器v-on:click
Jun 27 #Javascript
Vue.js学习记录之在元素与template中使用v-if指令实例
Jun 27 #Javascript
Vue.js常用指令之循环使用v-for指令教程
Jun 27 #Javascript
js获取地址栏参数的两种方法
Jun 27 #Javascript
You might like
用来给图片加水印的PHP类
2008/04/09 PHP
php中怎么搜索相关联数组键值及获取之
2013/10/17 PHP
ThinkPHP之用户注册登录留言完整实例
2014/07/22 PHP
PHP5.5.15+Apache2.4.10+MySQL5.6.20配置方法分享
2016/05/06 PHP
PHP+JS实现的商品秒杀倒计时用法示例
2016/11/15 PHP
基于PHP常用文件函数和目录函数整理
2017/08/17 PHP
PHP生成推广海报的方法分享
2018/04/22 PHP
javascript引用对象的方法
2007/01/11 Javascript
Google的跟踪代码 动态加载js代码方法应用
2012/11/12 Javascript
JavaScript:new 一个函数和直接调用函数的区别分析
2013/07/10 Javascript
Jquery中扩展方法extend使用技巧
2014/08/24 Javascript
javascript中一些util方法汇总
2015/06/10 Javascript
js验证身份证号有效性并提示对应信息
2015/10/19 Javascript
jQuery EasyUI API 中文帮助文档和扩展实例
2016/08/01 Javascript
微信小程序 动态的设置图片的高度和宽度详解及实例代码
2017/02/24 Javascript
详解Vue学习笔记入门篇之组件的内容分发(slot)
2017/07/17 Javascript
JS解决IOS中拍照图片预览旋转90度BUG的问题
2017/09/13 Javascript
Angular4编程之表单响应功能示例
2017/12/13 Javascript
javascript将json格式数组下载为excel表格的方法
2017/12/22 Javascript
详解vue移动端项目的适配(以mint-ui为例)
2018/08/17 Javascript
Python中的exec、eval使用实例
2014/09/23 Python
Python Sql数据库增删改查操作简单封装
2016/04/18 Python
python spyder中读取txt为图片的方法
2018/04/27 Python
django传值给模板, 再用JS接收并进行操作的实例
2018/05/28 Python
python实现反转部分单向链表
2018/09/27 Python
通过实例解析python and和or使用方法
2020/11/14 Python
CSS3 制作绽放的莲花采用效果叠加实现
2013/01/31 HTML / CSS
自荐书模板
2013/12/19 职场文书
成品库仓管员岗位职责
2014/04/06 职场文书
乡镇安全生产目标责任书
2014/07/23 职场文书
群众路线教育实践活动剖析材料
2014/09/30 职场文书
社区好人好事材料
2014/12/26 职场文书
大队委员竞选演讲稿
2015/11/20 职场文书
Python实现生活常识解答机器人
2021/06/28 Python
SpringBoot中HttpSessionListener的简单使用方式
2022/03/17 Java/Android
SONY600GR,国产收音机厂商永远的痛
2022/04/05 无线电