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


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 相关文章推荐
js兼容标准的表格变色效果
Jun 28 Javascript
制作高质量的JQuery Plugin 插件的方法
Apr 20 Javascript
javascript笔记 String类replace函数的一些事
Sep 22 Javascript
IE8提示Invalid procedure call or argument 异常的解决方法
Sep 30 Javascript
用js的for循环获取radio选中的值
Oct 21 Javascript
Json实现异步请求提交评论无需跳转其他页面
Oct 11 Javascript
基于JavaScript实现根据手机定位获取当前具体位置(X省X市X县X街道X号)
Dec 29 Javascript
Javascript将双字节字符转换成单字节字符并计算长度
Jun 22 Javascript
JS高仿抛物线加入购物车特效实现代码
Feb 20 Javascript
javascript作用域链与执行环境详解
Mar 25 Javascript
Vue动态生成el-checkbox点击无法赋值的解决方法
Feb 21 Javascript
jQuery弹框插件使用方法详解
May 26 jQuery
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
Zend公司全球首推PHP认证
2006/10/09 PHP
php 全局变量范围分析
2009/08/07 PHP
编写Smarty插件在模板中直接加载数据的详细介绍
2013/06/26 PHP
PHP页面间传递值和保持值的方法
2016/08/24 PHP
php rmdir使用递归函数删除非空目录实例详解
2016/10/20 PHP
PHP实现网站访问量计数器
2017/10/27 PHP
PHP实现动态创建XML文档的方法
2018/03/30 PHP
Javascript检查图片大小不要让大图片撑破页面
2014/11/04 Javascript
angularJS与bootstrap结合实现动态加载弹出提示内容
2015/10/16 Javascript
jQuery实现右侧显示可向左滑动展示的深色QQ客服效果代码
2015/10/23 Javascript
微信小程序开发教程-手势解锁实例
2017/01/06 Javascript
JavaScript利用Date实现简单的倒计时实例
2017/01/12 Javascript
基于JavaScript实现图片连播和联级菜单实例代码
2017/07/28 Javascript
推荐10款扩展Web表单的JS插件
2017/12/25 Javascript
js实现前面自动补全位数的方法
2018/10/10 Javascript
深入浅出 Vue 系列 -- 数据劫持实现原理
2019/04/23 Javascript
微信小程序实现签字功能
2019/12/23 Javascript
通过实例解析js可枚举属性与不可枚举属性
2020/12/02 Javascript
[01:25]2014DOTA2国际邀请赛 zhou分析LGD比赛情况
2014/07/14 DOTA
Python中的测试模块unittest和doctest的使用教程
2015/04/14 Python
python字符串Intern机制详解
2019/07/01 Python
Tensorflow分批量读取数据教程
2020/02/07 Python
python去除删除数据中\u0000\u0001等unicode字符串的代码
2020/03/06 Python
全面总结使用CSS实现水平垂直居中效果的方法
2016/03/10 HTML / CSS
css3实现背景动态渐变效果
2019/12/10 HTML / CSS
Manduka官网:瑜伽垫、瑜伽毛巾和服装
2018/07/02 全球购物
什么是View State?
2013/01/27 面试题
运动会广播稿50字
2014/01/26 职场文书
挂牌仪式主持词
2014/03/20 职场文书
廉洁自律承诺书
2014/03/27 职场文书
授权委托书公证
2014/09/14 职场文书
银行求职自荐信范文
2015/03/04 职场文书
车间主任岗位职责范本
2015/04/08 职场文书
2015年计生工作总结范文
2015/04/24 职场文书
MySQL系列之七 MySQL存储引擎
2021/07/02 MySQL
Python Django / Flask如何使用Elasticsearch
2022/04/19 Python