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


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 相关文章推荐
jQuery 锚点跳转滚动条平滑滚动一句话代码
Apr 30 Javascript
js 实现复制到粘贴板的功能代码
May 13 Javascript
jQuery Tab插件 用于在Tab中显示iframe,附源码和详细说明
Jun 27 Javascript
JQuery实现鼠标滑过显示导航下拉列表
Sep 12 Javascript
jquery 根据name名获取元素的value值
Feb 27 Javascript
javascript消除window.close()的提示窗口
May 20 Javascript
js生成随机数(指定范围)的实例代码
Jul 10 Javascript
jquery实现拖动效果
Aug 10 Javascript
Javascript生成带参数的二维码示例
Oct 10 Javascript
vue上传图片到oss的方法示例(图片带有删除功能)
Sep 27 Javascript
angular6开发steps步骤条组件
Jul 04 Javascript
Node.js实现批量下载图片简单操作示例
Jan 18 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
关于Ext中form移除textfield方法:hide(),setVisible(false),remove()
2010/12/02 Javascript
JQuery遍历json数组的3种方法
2014/11/08 Javascript
理解javascript封装
2016/02/23 Javascript
Javascript HTML5 Canvas实现的一个画板
2020/04/12 Javascript
Struts2+jquery.form.js实现图片与文件上传的方法
2016/05/05 Javascript
同步文本框内容JS代码实现
2016/08/04 Javascript
AngularJS的ng-repeat指令与scope继承关系实例详解
2017/01/21 Javascript
详解AngularJS 模块化
2017/06/14 Javascript
详解如何在项目中使用jest测试react native组件
2018/02/09 Javascript
关于node-bindings无法在Electron中使用的解决办法
2018/12/18 Javascript
详解 微信小程序开发框架(MINA)
2019/05/17 Javascript
vue中filters 传入两个参数 / 使用两个filters的实现方法
2019/07/15 Javascript
vue quill editor 使用富文本添加上传音频功能
2020/01/14 Javascript
[05:03]显微镜下的DOTA2第十期——Ti3豪之超神幽鬼
2014/06/23 DOTA
[00:18]天涯墨客三技能展示
2018/08/25 DOTA
Python编程产生非均匀随机数的几种方法代码分享
2017/12/13 Python
python 实现读取一个excel多个sheet表并合并的方法
2019/02/12 Python
为何人工智能(AI)首选Python?读完这篇文章你就知道了(推荐)
2019/04/06 Python
python如何编写win程序
2020/06/08 Python
python3 循环读取excel文件并写入json操作
2020/07/14 Python
python Pexpect模块的使用
2020/12/25 Python
Python使用Turtle模块绘制国旗的方法示例
2021/02/28 Python
Html5适配iphoneX刘海屏的简单实现
2019/04/09 HTML / CSS
阿玛尼美国官方网站:Armani.com
2016/11/25 全球购物
大学毕业通用个人的求职信
2013/12/08 职场文书
企业军训感言
2014/02/08 职场文书
《夕阳真美》教学反思
2014/04/27 职场文书
秋天的怀念教学反思
2014/04/28 职场文书
计算机网络专业求职信
2014/06/05 职场文书
企业优秀团员事迹材料
2014/08/20 职场文书
党支部反对四风思想汇报
2014/10/10 职场文书
2014年质检工作总结
2014/11/26 职场文书
经营目标责任书
2015/05/08 职场文书
机关单位保密工作责任书
2015/05/11 职场文书
幼儿园大班教师评语
2019/06/21 职场文书
《哪吒之魔童降世》观后感:世上哪有随随便便的成功
2019/11/08 职场文书