场景:

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监听器实现页面间数据刷新的更多相关文章

  1. 详细介绍ASP.NET页面间数据传递的使用方法

    源码:http://www.jinhusns.com/Products/Download/?type=xcj 在ASP.NET中,页面间数据传递的方法有很多.下面为大家总结一下,页面间数据传递的方法. ...

  2. ASP.NET页面间数据传递的方法<转>

    ASP.NET页面间数据传递的方法 作者: 灰色的天空2  来源: 博客园  发布时间: 2010-10-28 11:06  阅读: 822 次  推荐: 0   原文链接   [收藏]   摘要:本 ...

  3. ASP.NET中实现页面间数据传递的方法

    说到页面间数据传递,很多人都会想到通过像Session这样的全局变量,但是向Session中添加的东西太多会增加服务器的压力,页面间数据传递,数据的作用范围越小越好.   ASP.NET页面间数据传递 ...

  4. ASP.NET 页面间数据传递的方法

    在做WEB开发时,很多地方会涉及到页面间的数据传递.这几天在完善教务基础系统,遇到了这个问题,上网查了一些资料,现总结如下: 说到页面间数据传递,很多人都会想到通过像Session这样的全局变量,但是 ...

  5. ASP.NET多种不同页面间数据传递的方法

    1. Get(即使用QueryString显式传递)     方式:在url后面跟参数.     特点:简单.方便.     缺点:字符串长度最长为255个字符:数据泄漏在url中.     适用数据 ...

  6. Xamarin.Forms(二) 返回页面的数据刷新

    这几天在做一个课程表的小程序,遇到了这样一个问题: app打开便是课程表的页面,如果课程表页面没有数据的话需要跳转到同步课表页面模拟登陆教务管理系统获取课表,并显示在课程表页面,这样就需要从同步课表页 ...

  7. ASP.NET页面间传值总结

    本文我们将讨论的是ASP.NET页面间数据传递的几种方法,对此希望能帮助大家正确的理解ASP.NET页面间数据传递的用处以及便利性. Web页面是无状态的,服务器对每一次请求都认为来自不同用户,因此, ...

  8. React Native移动开发实战-3-实现页面间的数据传递

    React Native使用props来实现页面间数据传递和通信.在React Native中,有两种方式可以存储和传递数据:props(属性)以及state(状态),其中: props通常是在父组件 ...

  9. 开发 | 如何在微信小程序的页面间传递数据?

    我们在之前发布过小程序页面传值方法的简单介绍,说明了在小程序开发中,两种常见的页面之间传值方法. 本期,知晓程序(微信号 zxcx0101)为你带来的是「倒数记日」小程序开发者带来的,小程序开发中,有 ...

随机推荐

  1. 委托(2).net 1.x中的委托

    上一篇已经演示了使用委托实现一个多语言问候的程序,这一篇文章来总结一下在.net 1.x中委托的使用方法. 既然委托是一个类型(class),那么它就要经历像类一个先声明,然后new一个对象,最后调用 ...

  2. jsp基础语言-jsp注释

    JSP注释可分为客户端注释和服务器端注释. 客户端注释:用户可通过浏览器中的源代码查看,且这种注释可以加入JSP表达式. 语法:<!-- 客户端注释[<%=表达式%>] --> ...

  3. Approval Process 在 Apex 中的使用

    Approval Process(批准过程)简介 批准过程是一个复杂的业务过程.详细的内容可以参考官方文档. 英文版 中文版 官方trailhead模块 在Apex中调用Approval Proces ...

  4. iOS----------使用cocoapods遇到的问题

    -bash: /usr/local/bin/pod: /System/Library/Frameworks/Ruby.framework/Versions/2.0/usr/bin/ruby: bad ...

  5. Python_实现json数据的jsonPath(精简版)定位及增删改操作

    基于python实现json数据的jsonPath(精简版)定位及增删改操作   by:授客 QQ:1033553122 实践环境 win7 64 Python 3.4.0 代码 #-*- encod ...

  6. Unity Profiler的使用

    选中Development Build.Autoconnect Profiler和Script Debugging三个选项,如下图所示. 点击Build And Run按钮,将会编译项目并安装APK到 ...

  7. Vue双向绑定原理,教你一步一步实现双向绑定

    当今前端天下以 Angular.React.vue 三足鼎立的局面,你不选择一个阵营基本上无法立足于前端,甚至是两个或者三个阵营都要选择,大势所趋. 所以我们要时刻保持好奇心,拥抱变化,只有在不断的变 ...

  8. python 3.7 安装mysqlclient 错误解决

    安装时出现的问题 >pip3.7 install mysqlclientCollecting mysqlclient  Using cached https://files.pythonhost ...

  9. 3星|《HBO的内容战略》:HBO与美国电视业大事记

    HBO的内容战略 基本是HBO与美国电视业的大事记.从电视的诞生讲起.HBO在1972年首播,1975年做出一个当时惊世骇俗的决定:勇卫星实时向全美发送信号,随即成为覆盖全国的电视台:80年代受到录像 ...

  10. Linux中删除特殊名称文件的多种方式

    今日分享:我们在肉体的疾病方面花了不少钱,精神的病害方面却没有花什么,现在已经到了时候,我们应该有不平凡的学校.--<瓦尔登湖> 前言 我们都知道,在linux删除一个文件可以使用rm命令 ...