浏览器跨标签页通信

最新推荐文章于 2024-11-02 12:42:04 发布

qq_48354174

最新推荐文章于 2024-11-02 12:42:04 发布

阅读量85

点赞数

文章标签： javascript

本文链接：https://blog.csdn.net/qq_48354174/article/details/135221875

版权

本文介绍了如何在Web应用中利用LocalStorage或SessionStorage进行跨标签页的数据共享，通过setItem方法存储数据，同时展示了如何在其他标签页通过监听storage事件获取更新的数据。

摘要由CSDN通过智能技术生成

1：LocalStorage 或 SessionStorage：使用 Web 存储机制（LocalStorage 或 SessionStorage）可以在不同标签页之间共享数据。一个标签页可以将数据存储在 LocalStorage 或 SessionStorage 中，其他标签页可以监听存储事件来获取更新的数据。

 localStorage.setItem('count',  res.data.count)
 
// 在其他标签页中监听存储事件，并获取更新的数据
getcount(){
   let that = this
   window.addEventListener('storage',function(event){
     console.log(event,'event');
     if(event.key == 'count'){
       console.log(event.newValue,'新值');
       that.setxiaoxi(event.newValue)
     }
   })
},