微信小程序tabBar 返回tabBar不刷新页面


Posted in Javascript onJuly 25, 2019

1、在一个项目中,遇到了这个场景:返回tabBar中的某个页面是需要保存数据,但是新进这个页面需要清除数据。

2、场景如下图:报修进入下一步,返回第一步时不能刷新页面(即保留页面数据),从其他tabBar进入报修页面时就需要清空可能已经填写的数据。

微信小程序tabBar 返回tabBar不刷新页面

微信小程序tabBar 返回tabBar不刷新页面

3、解决办法,在第二步页面做了一个本地存储变量,在第一步的页面判断这个变量进而确定是否是第二步页面返回。

其中,因为第一步有上传图片的操作,也会执行"onShow",因此在当前页面又新增了一个变量去判断onShow是否是上传图片引起的。

第二步页面代码:

onShow: function () {
  wx.setStorageSync('repair',1)
 },

第一步页面代码:注:temp在声明的时候是0,这个变量是在上传图片成功后置为了1

onShow: function () {
  let value = wx.getStorageSync('repair');
  var _tmp = this.data.temp;
  //返回的时候不清空数据
  if (!value){
   //清空数据
   this.setData({
    data:""
   })

  }
 },
onHide: function () {
  if(this.data.temp){
   wx.setStorageSync('repair', 1);
  }else{
   wx.removeStorageSync("repair");
  } 
 },

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript贪吃蛇完整版(源码)
Dec 09 Javascript
js利用事件的阻止冒泡实现点击空白模态框的隐藏
Jan 24 Javascript
JavaScript中isPrototypeOf函数作用和使用实例
Jun 01 Javascript
浅析Node.js中的内存泄漏问题
Jun 23 Javascript
js重写方法的简单实现
Jul 10 Javascript
js前端面试题及答案整理(一)
Aug 26 Javascript
w3c编程挑战_初级脚本算法实战篇
Jun 23 Javascript
Angular2中监听数据更新的方法
Aug 31 Javascript
jQuery实现的点击显示隐藏下拉菜单功能完整示例
May 17 jQuery
vue element 中的table动态渲染实现(动态表头)
Nov 21 Javascript
JavaScript 替换所有匹配内容及正则替换方法
Feb 12 Javascript
vue中div禁止点击事件的实现
Apr 02 Vue.js
微信小程序与公众号实现数据互通的方法
Jul 25 #Javascript
微信JS-SDK实现微信会员卡功能(给用户微信卡包里发送会员卡)
Jul 25 #Javascript
微信小程序实现收货地址左滑删除
Nov 18 #Javascript
jquery-ui 进度条功能示例【测试可用】
Jul 25 #jQuery
微信小程序实现左滑动删除效果
Mar 30 #Javascript
jquery ui 实现 tab标签功能示例【测试可用】
Jul 25 #jQuery
小程序实现左滑删除效果
Jul 25 #Javascript
You might like
php 代码优化之经典示例
2011/03/24 PHP
php邮箱地址正则表达式验证
2015/11/13 PHP
PHP中的数组处理函数实例总结
2016/01/09 PHP
Laravel框架Blade模板简介及模板继承用法分析
2019/12/03 PHP
通过修改referer下载文件的方法
2008/05/11 Javascript
ExtJs设置GridPanel表格文本垂直居中示例
2013/07/15 Javascript
Nodejs学习笔记之NET模块
2015/01/13 NodeJs
使用jQueryMobile实现滑动翻页效果的方法
2015/02/04 Javascript
js弹出框、对话框、提示框、弹窗实现方法总结(推荐)
2016/05/31 Javascript
jquery html5 视频播放控制代码
2016/11/06 Javascript
微信小程序 rich-text的使用方法
2017/08/04 Javascript
Express系列之multer上传的使用
2017/10/27 Javascript
webpack4简单入门实例
2018/09/06 Javascript
记录一次完整的react hooks实践
2019/03/11 Javascript
vue下载excel的实现代码后台用post方法
2019/05/10 Javascript
调试Python程序代码的几种方法总结
2015/04/28 Python
Python3遍历目录树实现方法
2015/05/22 Python
python pandas中对Series数据进行轴向连接的实例
2018/06/08 Python
python实现自动获取IP并发送到邮箱
2018/12/26 Python
python+openCV利用摄像头实现人员活动检测
2019/06/22 Python
python 在sql语句中使用%s,%d,%f说明
2020/06/06 Python
ONLY德国官方在线商店:购买时尚女装
2017/09/21 全球购物
英国太阳镜品牌:Taylor Morris Eyewear
2018/04/18 全球购物
英国玛莎百货美国官网:Marks & Spencer美国
2018/11/06 全球购物
白俄罗斯女装和针织品网上商店:Presli.by
2019/10/13 全球购物
英语专业学子个人的自我评价
2013/10/02 职场文书
计算机工程学院个人求职信
2013/10/05 职场文书
电子商务专业个人的自我评价
2013/11/19 职场文书
档案保密承诺书
2014/06/03 职场文书
大学毕业生管理学求职信
2014/09/01 职场文书
产品陈列协议书(标准版)
2014/09/17 职场文书
2014年领班工作总结
2014/11/25 职场文书
2015年司机工作总结
2015/04/23 职场文书
教师节校长致辞
2015/07/31 职场文书
深入理解CSS 中 transform matrix矩阵变换问题
2021/08/30 HTML / CSS
图神经网络GNN算法
2022/05/11 Python