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

发布时间 2023-10-08 11:01:35作者: simonbaker

背景

后端同事提了个问题:

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

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

解决办法

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

常用的是postMessage和storage事件。

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

 

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