首页 > 其他分享 >不同tab页的数据如何保持一致?

不同tab页的数据如何保持一致?

时间:2023-10-08 11:16:07浏览次数:35  
标签:tab 不同 storage 实例 保持一致 数据 页面

背景

后端同事提了个问题:

当打开实例详情页面后,再打开一个tab页面,然后再访问实例详情页面。如果这时候在某一个tab页面切换到不同实例了,然后去到另一个tab页面进行实例的操作,比如升级或者停止。会误以为当前操作的是同一个实例。但很明显两个tab页的实例是不一样的,这样很容易出现误操作。

所以就想要保持不同tab页的数据统一。也就是在tab页面切换实例后,其他tab页也要跟着切换到该实例。

解决办法

该问题实际上解决的是不同tab页的通信问题。

常用的是postMessage和storage事件。

对比了下,我选择了storage事件来解决。

 

详情请查看: 不同tab页的数据如何保持一致?

 

标签:tab,不同,storage,实例,保持一致,数据,页面
From: https://www.cnblogs.com/simonbaker/p/17748397.html

相关文章

  • js_mind修改了支持单节点是否可编辑属性editable
    /***@licenseBSD*@[email protected]**ProjectHome:*https://github.com/hizzgdev/jsmind/*/;(function($w){'usestrict';console.warn("Theversionisoutdated.seedetails:https://hizzgdev.git......
  • 用pandas探索你的数据(五)-合并数据
    用pandas探索你的数据(五)-合并数据在数据处理和分析中,数据的合并是一项关键任务。Pandas提供了丰富的工具来处理不同来源的数据,并将它们合并成一个更大的数据集。在这篇文章中,我们将深入探讨Pandas中两个重要的数据合并函数:pd.concat()和pd.merge()。首先,我们将通过一系列的......
  • 升讯威在线客服系统的并发高性能数据处理技术:对接百度自动翻译
    我在业余时间开发维护了一款免费开源的升讯威在线客服系统,也收获了许多用户。对我来说,只要能获得用户的认可,就是我最大的动力。最近客服系统成功经受住了客户现场组织的压力测试,获得了客户的认可。客户组织多名客服上线后,所有员工同一时间打开访客页面疯狂不停的给在线客服发消......
  • VSCode & Intellij IDEA CE 数据库连接
    VSCode&IntellijIDEACE数据库连接大概记一下现在正在用的几个工具/插件VSCodeVSCode里面的工具我下载了很多,如果只是链接MySQL的话,可能用JunHan这位大佬的MySQL就好了:使用这个插件直接打开.sql文件单击运行就能跑sql命令,而且跑起来也挺方便的不过我们项目......
  • ubuntu下mysql有表却提示table doesn't exist
    linux里面的mysql是区分大小写的,windows下的mysql不区分。在mysql的安装目录里面找到mysqld.cnf文件,在[mysqld]的下面(可以看到还有别的配置信息)添加  lower_case_table_names=1  就行了。我的这个配置文件的目录是/etc/mysql/mysql.conf.d文件夹下。......
  • 盘点一个Python自动化办公Excel数据填充实战案例(上篇)
    大家好,我是皮皮。一、前言前几天在Python白银交流群【上海新年人】问了一个Python自动化办公的问题,一起来看看吧。有个表格,里面每行信息,如下图所示:现在需要将数据贴到另一个文件指定单元格中,另一个文件是这样子的。下图是他的原始数据和他想得到的目标数据,一页有三个,如下所......
  • Redis数据类型和应用场景
    一、Redis常用的5种数据类型字符串(String):最基本的数据类型,可以存储字符串、整数或浮点数。哈希(Hash):键值对的集合,可以在一个哈希数据结构中存储多个字段和值。列表(List):按照插入顺序存储一组有序的值,可以在列表的两端执行插入、删除和访问操作。集合(Set):无序的唯一值的集合,支持......
  • 高效数据管理:Java助力实现Excel数据验证
    摘要:本文由葡萄城技术团队原创并首发。转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具、解决方案和服务,赋能开发者。前言在Java中,开发者可以使用一些开源的库(如ApachePOI)来添加、修改和处理Excel中的数据:包括数字、文本、日期、列表等。每种数据验证类型都具有不......
  • WSL docker环境中运行StableDiffusion
    教程来源RunningStableDiffusionWebUIUsingDocker|SygilWebUI(sygil-dev.github.io)1.安装运行的依赖环境1.1安装docker (https://docs.docker.com/engine/install/#supported-platforms)1.2 https://docs.nvidia.com/datacenter/cloud-native/container-toolk......
  • Rockchip RK3399 - linux下抓取usb数据包
    ----------------------------------------------------------------------------------------------------------------------------开发板:NanoPC-T4开发板eMMC:16GBLPDDR3:4GB显示屏:15.6英寸HDMI接口显示屏u-boot:2017.09linux:4.19----------------------------------......