Vue跨标签通讯(本地存储)(踩坑)

我司有一个需求【用户指引】 需求是根标签有一个用户指引总开关,可以控制页面所有的用户指引是否在页面进入后初始是否默认打开,但是有些页面会新开标签这就设计到跨标签通讯了

我采取的方案是本地存储

重点:首先本地存储在页面是同源(即域名协议端口三者都相同)的情况下是可以相互访问的

起初是打算用sessionStorage这样用户一刷新页面就默认是关闭的不会存在继续打开这样用户体验会更好(坑来)

步骤1:当我点击本地存储的时候绘画里面会新增一条记录


 

 步骤二:点击新开标签页

 
我们会发现新标签访问绘画存储是没有数据的,但是根标签是有数据的(思维冲突:绘画存储是只要是新标签第一次加载就会清除就会情况绘画仓库里面的所有数据,后续刷新页面是不会清除的)
结论:同源的标签页面的本地存储是继承且相互独立的,绘画存储会清除当前标签页面的本地存储但是不会影响其它页面的绘画存储

解决方案 :换成localStorage存储就不会出现这个问题

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.xdnf.cn/news/34799.html

如若内容造成侵权/违法违规/事实不符,请联系一条长河网进行投诉反馈,一经查实,立即删除!

相关文章

Scrapy解析JSON响应v

在 Scrapy 中解析 JSON 响应非常常见,特别是当目标网站的 API 返回 JSON 数据时。Scrapy 提供了一些工具和方法来轻松处理 JSON 响应。 1、问题背景 Scrapy中如何解析JSON响应? 有一只爬虫(点击查看源代码),它可以完美地完成常规的HTML页面…

机器学习生物医学

Nature与Science重磅!AI与生物医药迎来百年来最重磅进展!https://mp.weixin.qq.com/s/Vw3Jm4vVKP14_UH2jqwsxA 第一天 机器学习及生物医学中应用简介 1. 机器学习及生物医学中应用简介 2. 机器学习基本概念介绍 3. 常用机器学习模型介绍&#xff0…

ISIS五

L1路由器的次优路径问题 路由渗透 可以打标签 等价路由上面下面都把骨干区域引入非骨干 强制ATT位不置位为1 attached-bit advertise never 在AR2上禁止ATT置位为1 在AR3没有禁止呀还是有默认路由 ISIS选路机制: L1的路由优于L2的路由 星号bit 叫DU-bit 知道…

BFC的理解

BFC的理解 BFC是什么?BFC如何触发?BFC的作用问题解决Margin重叠问题Margin塌陷问题高度塌陷 BFC是什么? BFC是块级格式上下文(Block Formatting Context),是CSS布局的一个概念,在BFC布局里面的…

C++入门基础

一、C的第一个程序 C兼容C语⾔绝大多数的语法&#xff0c;所以C语言实现的hello world依旧可以运行&#xff0c;C中需要把定义⽂件 代码后缀改为.cpp&#xff0c;vs编译器看到是.cpp就会调⽤C编译器编译&#xff0c;linux下要⽤g编译&#xff0c;不再是gcc #include<stdio.h…

VMware 安装国产操作系统UOS过程

VMware是一个虚拟化的平台&#xff0c;在这个平台上能训练操作系统&#xff08;客户端版本和服务器端版本&#xff09;&#xff0c;在真机的条件下虚拟出更多的应用场景。&#xff08;如果你的硬件设备足够强悍&#xff0c;可以通常这个平台虚拟出256个终端&#xff08;可能会更…

仿蝠鲼软体机器人实现高速多模态游动

近期&#xff0c;华南理工大学周奕彤老师研究团队最新成果"Manta Ray-Inspired Soft Robotic Swimmer for High-speed and Multi-modal Swimming"被机器人领域会议 IEEE/RSJ International Conference on Intelligent Robots and Systems&#xff08;IROS 2024&#…

稀土阻燃剂:电子设备的安全守护者

稀土阻燃剂是一类以稀土元素为基础的阻燃材料&#xff0c;广泛应用于电子设备中&#xff0c;主要用于提高材料的阻燃性能和热稳定性&#xff0c;以满足现代电子设备对安全性和可靠性的要求。稀土阻燃剂在电子设备中的应用具有以下特点&#xff1a; 1. 电路板&#xff1a;稀土阻…

Issue id: AppLinkUrlError 应用intent-filter 配置深链接 URL 问题分析 | AndroidManifest

AndroidManifest.xml 配置文件中&#xff0c;对 activity 组件进行声明的时候&#xff0c;独立应用在 IDE 显示 intent-filter 报错&#xff0c;但不影响实际编译&#xff0c;因为是系统应用&#xff0c;肯定会有此 URL 的存在。 AOSP 源码&#xff1a; <activity android:…

QT 中 sqlite 数据库使用

一、前提 --pro文件添加sql模块QT core gui sql二、使用 说明 --用于与数据库建立连接QSqlDatabase--执行各种sql语句QSqlQuery--提供数据库特定的错误信息QSqlError查看qt支持的驱动 QStringList list QSqlDatabase::drivers();qDebug()<<list;连接 sqlite3 数据库 …

扫二维码进小程序的指定页面

草料二维码解码器 微信开发者工具 获取二维码解码的参数->是否登陆->跳转 options.q onLoad: function (options) {// console.log("options",options.q)if (options && options.q) {// 解码二维码携带的链接信息let qrUrl decodeURIComponent(optio…

微信小程序介绍-以及写项目流程(重要)

前言&#xff1a;本篇文章介绍微信小程序以及项目介绍&#xff1a; 文章介绍&#xff1a;介绍了微信小程序常用的指令、组件、api。tips&#xff1a;最好按照官方文档来进行学习&#xff0c;大致可以我的目录来学习&#xff0c;对于写项目是没有问题的 微信小程序官方文档https…

Apache Dolphinscheduler可视化 DAG 工作流任务调度系统

Apache Dolphinscheduler 关于 一个分布式易扩展的可视化 DAG 工作流任务调度系统。致力于解决数据处理流程中错综复杂的依赖关系&#xff0c;使调度系统在数据处理流程中开箱即用。 DolphinScheduler 的主要特性如下&#xff1a; 易于部署&#xff0c;提供四种部署方式&am…

“原批教育家”原批之星鲁健的杰作——原批俱乐部

伟大的原批教育家——原批之星&#xff0c;名为鲁健&#xff0c;是一位在南京邮电大学智能科学与技术专业中崭露头角的杰出人物。他不仅以其卓越的黑客技术和对网络正义的执着而闻名&#xff0c;更是“远古四神”之一&#xff0c;以其对原批之力的深刻理解和不同见解&#xff0…

github深度学习项目复现教程

如何找感兴趣的项目&#xff1f; 使用github或papers with code搜索关键词“deep learning”等&#xff0c;最受欢迎的是stars数最多的 查看readme 是否清晰地描述了项目目标、使用的技术、安装步骤和运行方法 是否包含依赖项、所需数据集和训练模型等信息 1、准备环境 如…

在玩“吃鸡”的时候游戏崩溃要如何解决?游戏运行时崩溃是什么原因?

“吃鸡”游戏崩溃问题深度解析与解决方案&#xff1a;原因、修复与预防 在紧张刺激的“吃鸡”&#xff08;即《绝地求生》&#xff09;游戏中&#xff0c;突然遭遇游戏崩溃无疑会让玩家倍感沮丧。作为一名经验丰富的软件开发从业者&#xff0c;我深知游戏崩溃可能由多种因素引…

YOLOv8实战道路裂缝缺陷识别

本文采用YOLOv8作为核心算法框架&#xff0c;结合PyQt5构建用户界面&#xff0c;使用Python3进行开发。YOLOv8以其高效的实时检测能力&#xff0c;在多个目标检测任务中展现出卓越性能。本研究针对道路裂缝数据集进行训练和优化&#xff0c;该数据集包含丰富的道路裂缝图像样本…

数字赋能 自主创新 | 华望系统科技在2024年度“直通乌镇”全球互联网大赛上斩获大奖!

11月22日&#xff0c;2024年度“直通乌镇”全球互联网大赛颁奖典礼在浙江乌镇举行。杭州华望系统科技有限公司&#xff08;以下简称“华望系统科技”&#xff09;的参赛项目“基于模型的系统工程建模工具软件”先后经过初赛、复赛和决赛的激烈角逐&#xff0c;从来自全球27个国…

代际跃升丨Modbus转Profinet网关与伺服的智能之旅

本案例详细介绍了如何通过开疆智能Modbus转Profinet网关KJ-PNG-201实现GSHD系列高性能伺服驱动器与西门子S7-1200 PLC之间的连接与配置。在这个过程中&#xff0c;我们使用了西门子S7-1200 PLC作为控制核心&#xff0c;Modbus转Profinet网关作为通信桥梁&#xff0c;以及GSHD系…

反转链表||动静态链接

反转链表 II 第一种方法&#xff1a;使用数组顺序记录区间内节点的地址&#xff0c;然后双指针双向向内遍历节点地址&#xff0c;逐步交换节点存储数值。时间复杂度为on、空间复杂度为on class Solution { public:ListNode* reverseBetween(ListNode* head, int left, int ri…