BEX5下增加sessionStorage监听器实现页面间数据刷新
场景:
A页面修改了数据,希望B页面能进行及时的同步前端数据,但是假如当A页面修改保存后,去获得B页面的model对象,会增加开发的难度,同时A页面也不能重复利用;假如在B页面的激活事件里面写刷新代码,因为并不是每次激活都需要刷新,会造成资源浪费,而且当B页面内嵌到某页面时激活事件会失效,所以引用sessionStorage监听器来进行监听,通过修改sessionStorage的值来让监听器执行事件。
1 在需要进行刷新数据的页面的加载事件中增加监听器代码
this.addStorageListener();
监听器代码的具体实现
// 增加storage监听
Model.prototype.addStorageListener = function(){
var me = this;
var orignalSetItem = sessionStorage.setItem; // 改写localStorage 可以让同页面也能进行触发
sessionStorage.setItem = function(key,newValue){
var setItemEvent = new Event("setItemEvent");
setItemEvent.newValue = newValue;
setItemEvent.key = key;
window.dispatchEvent(setItemEvent);
orignalSetItem.apply(this,arguments);
};
window.addEventListener("setItemEvent", function (e) {
if(e.key=="IndexRefresh"&&e.newValue){ // 不是所有的key都需要触发
// 执行代码
…… // 执行完删除掉刷新的值
sessionStorage.removeItem("IndexRefresh");
} });
};
2 在需要提醒的页面写通知代码
sessionStorage.setItem("IndexRefresh", "D_B,X_X");
备注:以上方法只能进行当前用户的前端数据的统一,假如需要能跟后端数据进行实时的刷新,可以查询websocket相关的技术
BEX5下增加sessionStorage监听器实现页面间数据刷新的更多相关文章
- 详细介绍ASP.NET页面间数据传递的使用方法
源码:http://www.jinhusns.com/Products/Download/?type=xcj 在ASP.NET中,页面间数据传递的方法有很多.下面为大家总结一下,页面间数据传递的方法. ...
- ASP.NET页面间数据传递的方法<转>
ASP.NET页面间数据传递的方法 作者: 灰色的天空2 来源: 博客园 发布时间: 2010-10-28 11:06 阅读: 822 次 推荐: 0 原文链接 [收藏] 摘要:本 ...
- ASP.NET中实现页面间数据传递的方法
说到页面间数据传递,很多人都会想到通过像Session这样的全局变量,但是向Session中添加的东西太多会增加服务器的压力,页面间数据传递,数据的作用范围越小越好. ASP.NET页面间数据传递 ...
- ASP.NET 页面间数据传递的方法
在做WEB开发时,很多地方会涉及到页面间的数据传递.这几天在完善教务基础系统,遇到了这个问题,上网查了一些资料,现总结如下: 说到页面间数据传递,很多人都会想到通过像Session这样的全局变量,但是 ...
- ASP.NET多种不同页面间数据传递的方法
1. Get(即使用QueryString显式传递) 方式:在url后面跟参数. 特点:简单.方便. 缺点:字符串长度最长为255个字符:数据泄漏在url中. 适用数据 ...
- Xamarin.Forms(二) 返回页面的数据刷新
这几天在做一个课程表的小程序,遇到了这样一个问题: app打开便是课程表的页面,如果课程表页面没有数据的话需要跳转到同步课表页面模拟登陆教务管理系统获取课表,并显示在课程表页面,这样就需要从同步课表页 ...
- ASP.NET页面间传值总结
本文我们将讨论的是ASP.NET页面间数据传递的几种方法,对此希望能帮助大家正确的理解ASP.NET页面间数据传递的用处以及便利性. Web页面是无状态的,服务器对每一次请求都认为来自不同用户,因此, ...
- React Native移动开发实战-3-实现页面间的数据传递
React Native使用props来实现页面间数据传递和通信.在React Native中,有两种方式可以存储和传递数据:props(属性)以及state(状态),其中: props通常是在父组件 ...
- 开发 | 如何在微信小程序的页面间传递数据?
我们在之前发布过小程序页面传值方法的简单介绍,说明了在小程序开发中,两种常见的页面之间传值方法. 本期,知晓程序(微信号 zxcx0101)为你带来的是「倒数记日」小程序开发者带来的,小程序开发中,有 ...
随机推荐
- 如何优雅的使用 Python 实现文件递归遍历
今天有个脚本需要遍历获取某指定文件夹下面的所有文件,我记得很早前也实现过文件遍历和目录遍历的功能,于是找来看一看,嘿,不看不知道,看了吓一跳,原来之前我竟然用了这么搓的实现. 先发出来看看: def ...
- Web前端 页面功能——点击按钮返回顶部的实现方法
1. 最简单的静态返回顶部,点击直接跳转页面顶部,常见于固定放置在页面底部返回顶部功能 方法一:用命名锚点击返回到顶部预设的id为top的元素 html代码 <a href="#top ...
- 解决No 'Access-Control-Allow-Origin' header is present on the requested resource.跨域问题(后台(java)解决方法)
附:前端常见跨域解决方案(全) 跨域错误 解决方法 在后台写一个过滤器来改写请求头 附上一个前端不知所以然的后台java代码: public class CorsFilter implements F ...
- Arcgis瓦片--数据获取
Arcgis的二维地图瓦片有两种获取方式 1.在Arcmap中对配置好的地图进行切图,生成对应瓦片 2.使用第三方的地图下载器,直接下载,导出成arcgis瓦片格式即可使用. 备注:这里主要介绍第二种 ...
- 从.Net到Java学习第十一篇——SpringBoot登录实现
从.Net到Java学习系列目录 通过前面10篇文章的学习,相信我们对SpringBoot已经有了一些了解,那么如何来验证我们的学习成果呢?当然是通过做项目来证明啦!所以从这一篇开始我将会对之前自己做 ...
- Apex 中的自定义迭代器
迭代器 迭代器(iterator)可以遍历一个集合变量中的每个元素.Apex提供了Iterator接口来让开发者实现自定义的迭代器. Iterator接口 Iterator接口定义了两个函数: has ...
- 怎么打开iPhone的开发者模式
1.需要连接Xcode 2.打开一个app就有了
- Linux 中磁盘阵列RAID10损坏以及修复
在Linux 中磁盘阵列RAID10配置中我们已经正确配置了RAID10 ,一般来说在RAID10中最多允许50%的磁盘损毁,当然除了,同一磁盘RAID1中的硬盘设备全部损毁. 这次我们讨论一下:假设 ...
- input(type='file')上传多张照片并显示,传到后台
以下内容为网络摘抄和实践修改所得,如有雷同,请谅解!!!! 1.首先是前端页面代码: 其中,<input type="file" id="file_input&qu ...
- 尝试Java,从入门到Kotlin(上)
之前一直使用C#开发,最近由于眼馋Java生态环境,并借着工作服务化改造的契机,直接将新项目的开发都转到Java上去.积攒些Java开发经验,应该对.NET开发也会有所启发和益处. 从理论上说,Jav ...