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


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 通过事件委派一次绑定多种事件,以减少事件冗余
Jun 30 Javascript
基于jquery的代码显示区域自动拉长效果
Dec 07 Javascript
ASP.NET jQuery 实例1(在TextBox里面创建一个默认提示)
Jan 13 Javascript
JavaScript字符串对象charAt方法入门实例(用于取得指定位置的字符)
Oct 17 Javascript
基于JS代码实现实时显示系统时间
Jun 16 Javascript
jQuery操作iframe中js函数的方法小结
Jul 06 Javascript
vue.js学习之递归组件
Dec 13 Javascript
node结合swig渲染摸板的方法
Apr 11 Javascript
vue中过滤器filter的讲解
Jan 21 Javascript
微信小程序点击滚动到指定位置的实现
May 22 Javascript
JavaScript实现串行请求的示例代码
Sep 14 Javascript
解读Vue组件注册方式
May 15 Vue.js
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
yii框架无限极分类的实现方法
2017/04/08 PHP
ExtJS下grid的一些属性说明
2009/12/13 Javascript
(jQuery,mootools,dojo)使用适合自己的编程别名命名
2010/09/14 Javascript
js实现广告漂浮效果的小例子
2013/07/02 Javascript
jquery隐藏标签和显示标签的实例
2013/11/11 Javascript
Node.js 制作实时多人游戏框架
2015/01/08 Javascript
jQuery事件绑定on()、bind()与delegate() 方法详解
2015/06/03 Javascript
JS实战篇之收缩菜单表单布局
2016/12/10 Javascript
微信小程序 页面跳转传递值几种方法详解
2017/01/12 Javascript
基于node.js实现微信支付退款功能
2017/12/19 Javascript
node.js文件上传重命名以及移动位置的示例代码
2018/01/19 Javascript
vue内置指令详解
2018/04/03 Javascript
使用jQuery动态设置单选框的选中效果
2018/12/06 jQuery
jquery实现聊天机器人
2020/02/08 jQuery
在vue项目中promise解决回调地狱和并发请求的问题
2020/11/09 Javascript
[01:24:34]2014 DOTA2华西杯精英邀请赛5 24 DK VS LGD
2014/05/25 DOTA
用Python实现协同过滤的教程
2015/04/08 Python
Hadoop中的Python框架的使用指南
2015/04/22 Python
详解Django中的权限和组以及消息
2015/07/23 Python
Python Web程序部署到Ubuntu服务器上的方法
2018/02/22 Python
Python使用Django实现博客系统完整版
2020/09/29 Python
pycharm中使用anaconda部署python环境的方法步骤
2018/12/19 Python
使用Python检测文章抄袭及去重算法原理解析
2019/06/14 Python
新手如何发布Python项目开源包过程详解
2019/07/11 Python
TensorFlow实现从txt文件读取数据
2020/02/05 Python
pandas使用之宽表变窄表的实现
2020/04/12 Python
Python3实现英文字母转换哥特式字体实例代码
2020/09/01 Python
HTML5 video播放器全屏(fullScreen)方法实例
2015/04/24 HTML / CSS
台湾SHOPRO购物行家:亚洲首创影视.3C.家电.优质购物平台
2018/05/07 全球购物
马来西亚在线健康商店:Medipal Malaysia
2020/04/13 全球购物
交通法规咨询中心工作职责
2013/11/27 职场文书
大学考试作弊检讨书
2014/01/30 职场文书
公司行政专员岗位职责
2014/08/24 职场文书
巾帼文明岗事迹材料
2014/12/24 职场文书
详解vue中v-for的key唯一性
2021/05/15 Vue.js
TS 类型收窄教程示例详解
2022/09/23 Javascript