微信小程序判断页面是否从其他页面返回的实例代码


Posted in Javascript onJuly 03, 2019

微信小程序判断页面是否从其他页面返回,具体内容如下所示:

在 data 中自定义一个标记变量,在onLoad里

Page({
 data: {
  isNewOpen: true, //判断当前页面是新打开还是从其他页面返回 
  list: [], 
  page: 0
 },

 onLoad: function() { 
  this.getList()
 },
 
 getList () {
   // ...
 },
 
 goDetail (e) { 
  this.setData({
   isNewOpen: false
  })
  wx.navigateTo({
   url: `/pages/detail/detail`,
  }) 
 },
 
 onShow: function () {if (!this.data.isNewOpen) {
   this.setData({
    page: 2, // 页码
    isClose: true,
    list: []
   })
   this.getList()
  }
 },
})

ps:下面看下微信小程序 判断当前页面是重新打开,还是从其他页面返回

在小程序中设置变量用来判断是否是从其他页面返回

在 data 数据中声明一个变量 isClose, 默认为 true 。用来判断是正常打开,还是从其他页面返回。当点击跳转页面或者关闭小程序的时候,会触发 OnHide 函数,在此函数中将判断 isClose is true 的时候即为正常打开。当跳转页面时首先将 isClose 设置为 false, 这样 触发 OnHide 函数的时候,isClose is flase 并不会执行,进入跳转的页面,然后在由页面进行返回这是会触发跳转的页面的 OnUnload 函数 在此函数中 设置一个定时器 在 200ms 之后将 isClose 改为 true 这样当关闭小程序 再次进入的时候 isColse 依然为true 判断时是首次进入页面

实例

data:

data: {
  isClose:true   //判断当前页面是打开还是返回页
  }

跳转页面:

this.setData({ isClose:false})
  wx.navigateTo({
   url: '../index/index?',
  })

onUnload:

/**
  * 生命周期函数--监听页面卸载
  */
 onUnload: function () {
  var that =this
  setTimeout(function () {
   that.setData({ isClose: true })
  }, 200)

 },

onHide:

/**
  * 生命周期函数--监听页面隐藏
  */
 onHide: function () {
  if (this.data.isClose) {
   console.log('重新打开')
  }
 },

onShow:

/**
  * 生命周期函数--监听页面显示
  */
 onShow: function () {
  console.log(this.data.isClose)
  if (!this.data.isClose) {
   this.onLoad();
  }
 },

总结

以上所述是小编给大家介绍的微信小程序判断页面是否从其他页面返回的实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

Javascript 相关文章推荐
仿校内登陆框,精美,给那些很厉害但是没有设计天才的程序员
Nov 24 Javascript
JavaScript Event学习第五章 高级事件注册模型
Feb 07 Javascript
extjs实现选择多表自定义查询功能 前台部分(ext源码)
Dec 20 Javascript
JS给Array添加是否包含字符串的简单方法
Oct 29 Javascript
禁用backspace网页回退功能的实现代码
Nov 15 Javascript
node实现定时发送邮件的示例代码
Aug 26 Javascript
Vue项目组件化工程开发实践方案
Jan 09 Javascript
详解javascript中的变量提升和函数提升
May 24 Javascript
js操作table中tr的顺序实现上移下移一行的效果
Nov 22 Javascript
JS中队列和双端队列实现及应用详解
Sep 29 Javascript
微信小程序实现多张图片上传功能
Nov 18 Javascript
linux服务器快速卸载安装node环境(简单上手)
Feb 22 Javascript
8 个有用的JS技巧(推荐)
Jul 03 #Javascript
vue swipe自定义组件实现轮播效果
Jul 03 #Javascript
20个必会的JavaScript面试题(小结)
Jul 02 #Javascript
微信小程序如何调用新闻接口实现列表循环
Jul 02 #Javascript
Angular.JS读取数据库数据调用完整实例
Jul 02 #Javascript
js实现for循环跳过undefined值示例
Jul 02 #Javascript
Vue的路由及路由钩子函数的实现
Jul 02 #Javascript
You might like
php上传中文文件名乱码问题处理方案
2015/02/03 PHP
Linux系统递归生成目录中文件的md5的方法
2015/06/29 PHP
PHP使用逆波兰式计算工资的方法
2015/07/29 PHP
关于Laravel Route重定向的一个注意点
2017/01/16 PHP
PHP使用zlib扩展实现GZIP压缩输出的方法详解
2018/04/09 PHP
PHP常见数组排序方法小结
2018/08/20 PHP
JavaScript DOM 学习第七章 表单的扩展
2010/02/19 Javascript
js showModalDialog参数的使用详解
2014/01/07 Javascript
jqTransform美化表单
2015/10/10 Javascript
两行代码轻松搞定JavaScript日期验证
2016/08/03 Javascript
浅谈JavaScript 函数参数传递到底是值传递还是引用传递
2016/08/23 Javascript
JavaScript实现替换字符串中最后一个字符的方法
2017/03/07 Javascript
从零开始学习Node.js系列教程四:多页面实现的数学运算示例
2017/04/13 Javascript
使用Vue.js和Element-UI做一个简单登录页面的实例
2018/02/23 Javascript
详解JavaScript的数据类型以及数据类型的转换
2019/04/20 Javascript
vuex(vue状态管理)的特殊应用案例分享
2020/03/03 Javascript
JavaScript实现动态留言板
2020/03/16 Javascript
js 获取扫码枪输入数据的方法
2020/06/10 Javascript
[48:00]EG vs LGD 2018国际邀请赛淘汰赛BO3 第二场 8.26
2018/08/29 DOTA
Python中的闭包总结
2014/09/18 Python
Python中逗号的三种作用实例分析
2015/06/08 Python
python中numpy基础学习及进行数组和矢量计算
2017/02/12 Python
Python tornado队列示例-一个并发web爬虫代码分享
2018/01/09 Python
关于python2 csv写入空白行的问题
2018/06/22 Python
python获取服务器响应cookie的实例
2018/12/28 Python
python爬虫开发之使用Python爬虫库requests多线程抓取猫眼电影TOP100实例
2020/03/10 Python
如何卸载python插件
2020/07/08 Python
python跨文件使用全局变量的实现
2020/11/17 Python
利用css3 translate完美实现表头固定效果
2017/02/28 HTML / CSS
美国时尚女装在线:Missguided
2016/12/03 全球购物
可持续未来的时尚基础:Alternative Apparel
2019/05/06 全球购物
简述数组与指针的区别
2014/01/02 面试题
新学期开学标语
2014/06/30 职场文书
2014幼儿园小班工作总结
2014/11/10 职场文书
参观监狱警示教育心得体会
2016/01/15 职场文书
Oracle数据库事务的开启与结束详解
2022/06/25 Oracle