微信小程序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 相关文章推荐
filemanage功能中用到的lib.js
Apr 08 Javascript
使用ExtJS技术实现的拖动树结点
Aug 05 Javascript
setTimeout的延时为0时多个浏览器的区别
May 23 Javascript
通过JS来动态的修改url,实现对url的增删查改
Sep 01 Javascript
jQuery中element选择器用法实例
Dec 29 Javascript
浅谈JavaScript中变量和函数声明的提升
Aug 09 Javascript
关于jquery中动态增加select,事件无效的快速解决方法
Aug 29 Javascript
JS去除重复并统计数量的实现方法
Dec 15 Javascript
Vue + Vue-router 同名路由切换数据不更新的方法
Nov 20 Javascript
基于javascript的无缝滚动动画实现2
Aug 07 Javascript
vue实现移动端拖动排序
Aug 21 Javascript
JS前端使用canvas实现物体的点选示例
Aug 05 Javascript
微信小程序与公众号实现数据互通的方法
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
使用数据库保存session的方法
2006/10/09 PHP
PHP $_FILES函数详解
2011/03/09 PHP
php面向对象中的魔术方法中文说明
2014/03/04 PHP
php mysql数据库操作类(实例讲解)
2017/08/06 PHP
jquery学习总结(超级详细)
2014/09/04 Javascript
jQuery表格插件datatables用法汇总
2016/03/29 Javascript
javascript对象的相关操作小结
2016/05/16 Javascript
js中常用的Tab切换效果(推荐)
2016/08/30 Javascript
JavaScript简单下拉菜单特效
2016/09/13 Javascript
JS获取html元素的标记名实现方法
2016/10/08 Javascript
Chrome浏览器的alert弹窗禁止再次弹出后恢复的方法
2016/12/30 Javascript
整理关于Bootstrap排版的慕课笔记
2017/03/29 Javascript
使用Vue构建可重用的分页组件
2018/03/26 Javascript
ES6的解构赋值实例详解
2019/05/06 Javascript
js实现登录拖拽窗口
2020/02/10 Javascript
Layui弹框中数据表格中可双击选择一条数据的实现
2020/05/06 Javascript
js 图片懒加载的实现
2020/10/21 Javascript
nodeJs项目在阿里云的简单部署
2020/11/27 NodeJs
python中合并两个文本文件并按照姓名首字母排序的例子
2014/04/25 Python
Python中获取网页状态码的两个方法
2014/11/03 Python
windows 10下安装搭建django1.10.3和Apache2.4的方法
2017/04/05 Python
python2.7使用plotly绘制本地散点图和折线图
2019/04/02 Python
python GUI库图形界面开发之PyQt5下拉列表框控件QComboBox详细使用方法与实例
2020/02/27 Python
Pandas对DataFrame单列/多列进行运算(map, apply, transform, agg)
2020/06/14 Python
Staples加拿大官方网站:办公用品一站式采购
2016/09/25 全球购物
编写一子程序,将一链表倒序,即使链表表尾变表头,表头变表尾
2016/02/10 面试题
母亲追悼会答谢词
2014/01/27 职场文书
公司年终奖分配方案
2014/06/16 职场文书
户籍证明格式
2014/09/15 职场文书
团代会闭幕词
2015/01/28 职场文书
入党自荐书范文
2015/03/05 职场文书
2015年试用期自我评价范文
2015/03/10 职场文书
创业项目大全(适合在家创业的项目)
2019/08/15 职场文书
2019年农民幸福观调查的实践感悟
2019/12/19 职场文书
MySQL窗口函数的具体使用
2021/11/17 MySQL
MySQL七大JOIN的具体使用
2022/02/28 MySQL