electron 多窗口 vuex/pinia 数据状态同步简易方案(利用 LocalStorage)
全局 stroe 添加 mutations 状态同步方法
// 用于其他窗口同步 vuex 中的 DeviceTcpDataasyncDeviceTcpData(state: StateType, data: any) {state.deviceTcpData = data},
App.vue 里
onMounted(() => {console.log("App mounted");/*** vuex 多窗口 store 同步*/// 1. 初始赋值// 从 localStorage 同步 tcp 上报的数据到 vuexconst deviceTcpData = localStorage.getItem("deviceTcpData");if (deviceTcpData) {store.commit("asyncDeviceTcpData", JSON.parse(deviceTcpData));}// 2. 监听 storage 事件 同步 全局 state// 其他渲染进程,当设置进程进行修改storage的时候,其他进程可以根据storage变化来更改自己的storewindow.addEventListener("storage", () => {const deviceTcpData = localStorage.getItem("deviceTcpData");deviceTcpData &&store.commit("asyncDeviceTcpData", JSON.parse(deviceTcpData));});// 从主界面关闭时,清空本地存储的数据 (清除 localstorage 的时机)window.addEventListener("beforeunload", (e: any) => {if (route.name === "search") {localStorage.removeItem("deviceTcpData");}});
});
关键: 利用 watch 监听全局 state 的变动,每次变动,进行 localStorage 同步
// 监听 全局 store 的变动
watch(() => store.state.deviceTcpData,(val) => {console.log("watch 触发");console.log(val);localStorage.setItem("deviceTcpData", JSON.stringify(val));},{deep: true,}
);
缺点: 数据量大时,消耗性能较高。可用作少量数据的同步方案;
相关文章:
electron 多窗口 vuex/pinia 数据状态同步简易方案(利用 LocalStorage)
全局 stroe 添加 mutations 状态同步方法 // 用于其他窗口同步 vuex 中的 DeviceTcpDataasyncDeviceTcpData(state: StateType, data: any) {state.deviceTcpData data},App.vue 里 onMounted(() > {console.log("App mounted");/*** vuex 多窗口 store 同步*//…...
自定义数据集图像分类实现
模型训练 要使用自己的图片分类数据集进行训练,这意味着数据集应该包含一个目录,其中每个子目录代表一个类别,子目录中包含该类别的所有图片。以下是一个使用Keras和TensorFlow加载自定义图片数据集进行分类训练的例子。 我们自己创建的数据集…...
【C++】手搓读写ini文件源码
【C】手搓读写ini文件源码 思路需求:ini.hini.cppconfig.confmian.cpp 思路 ini文件是一种系统配置文件,它有特定的格式组成。通常做法,我们读取ini文件并按照ini格式进行解析即可。在c语言中,提供了模板类的功能,所以…...
undolog
undolog回滚段 undolog执行的时间:在执行器操作bufferpool之前。 undolog页...
项目文档分享
Hello , 我是小恒。提前祝福妈妈母亲节快乐 。 本文写一篇初成的项目文档 (不是README.md哈),仅供参考 项目名称 脚本存储网页 项目简介 本项目旨在创建一个网页,用于存储和展示各种命令,用户可以通过粘贴复制命令到…...
【深耕 Python】Quantum Computing 量子计算机(5)量子物理概念(二)
写在前面 往期量子计算机博客: 【深耕 Python】Quantum Computing 量子计算机(1)图像绘制基础 【深耕 Python】Quantum Computing 量子计算机(2)绘制电子运动平面波 【深耕 Python】Quantum Computing 量子计算机&…...
手写Spring5【笔记】
Spring5【笔记】 前言前言推荐Spring5【笔记】1介绍2手写 最后 前言 这是陈旧已久的草稿2022-12-01 23:32:59 这个是刷B站的时候,看到一个手写Spring的课程。 最后我自己好像运行不了,就没写。 现在2024-5-12 22:22:46,发布到[笔记]专栏中…...
2024中国(重庆)机器人展览会8月举办
2024中国(重庆)机器人展览会8月举办 邀请函 主办单位: 中国航空学会 重庆市南岸区人民政府 招商执行单位: 重庆港华展览有限公司 2024中国重庆机器人展会将汇聚机器人全产业链知名企业,世界科技领先的生产制造企业与来自多个国家和地区…...
Apache 开源项目文档中心 (英文 + 中文)
进度:持续更新中。。。 Apache Ambari 2.7.5 Apache Ambari Installation 2.7.5.0 (latest)Apache Ambari Installation 2.7.5.0 中文版 (latest) Apache DolphinScheduler Apache DolphinScheduler 1.2.0 中文版Apache DolphinScheduler 1.2.1 中文版...
蓝桥杯 算法提高 ADV-1164 和谐宿舍 python AC
贪心,二分 同类型题:蓝桥杯 算法提高 ADV-1175 打包 def judge(x):wood 0max_val 0ans_len 0for i in ll:if i > x:return Falseelif max(max_val, i) * (ans_len 1) < x:max_val max(max_val, i)ans_len 1else:wood 1max_val ians_len …...
Dragonfly 拓扑的路由算法
Dragonfly 拓扑的路由算法 1. Dragonfly 上的路由 (1)最小路由(2)非最小路由 2. 评估3. 存在问题 (1)吞吐量限制(2)较高的中间延迟 references Dragonfly 拓扑的路由算法 John Kim, William J. Dally 等人在 2008 年的 ISCA 中提出技术驱动、高度可扩展的 Dragonfly 拓扑。而…...
android基础-服务
同样使用intent来传递服务 oncreate是服务第一次启动调用,onStartCommand是服务每次启动的时候调用,也就是说服务只要启动后就不会调用oncreate方法了。可以在myservice中的任何位置调用stopself方法让服务停止下来。 服务生命周期 前台服务类似于通知会…...
mysql 事物
MySQL中的事务(Transaction)是一个确保数据完整性和一致性的重要概念。它将一组SQL操作捆绑在一起,当作一个单一的工作单元来执行。事务具备以下四个关键特性,即ACID特性: 原子性(Atomicity)&am…...
Unity Shader中获取像素点深度信息
1.顶点着色器中对深度进行计算 v2f vert(appdata v) {v2f o;o.pos UnityObjectToClipPos(v.vertex);o.uv TRANSFORM_TEX(v.uv, _MainTex);o.depth (o.pos.z / o.pos.w 1.0) * 0.5; // Normalize depth to [0, 1]return o; }但是达不到预期,最后返回的值一直大于…...
ROS——Action学习
文章目录 ROS Action概念自定义Action类型参考ROS Action概念 ROS Service会阻塞程序流,程序无法进行其它的工作,有时我们需要同时进行多个任务。 ROS Action可以满足要求,ROS Action提供程序的非阻塞执行。 Action是ROS Node的通信方式之一 Action server 向ROS系统广…...
基于C语言中的类型转换,C++标准创造出了更加可视化的类型转换
目录 前言 一、 C语言中的类型转换 二、为什么C需要四种类型转换 三、C中新增的四种强制类型转换操作符以及它们的应用场景 1.static_cast 2.reinterpret_cast 3.const_cast 4.dynamic_cast 前言 在C语言中,如果赋值运算符左右两侧的类型不同,或者…...
如何创建族表
https://jingyan.baidu.com/article/c275f6bafa5714a23c756768.html...
【UnityRPG游戏制作】Unity_RPG项目_PureMVC框架应用
👨💻个人主页:元宇宙-秩沅 👨💻 hallo 欢迎 点赞👍 收藏⭐ 留言📝 加关注✅! 👨💻 本文由 秩沅 原创 👨💻 收录于专栏:就业…...
并行计算的一些知识点分享--并行系统,并行程序, 并发,并行,分布式
并行计算 核是个啥? 在并行计算中,“核”通常指的是处理器的核心(CPU核心)。每个核心都是一个独立的处理单元,能够执行计算任务。多核处理器指的是拥有多个这样核心的单一物理处理器,这样的设计可以允许多…...
设计模式:访问者模式
访问者模式(Visitor Pattern)是行为设计模式的一种,它使你能够在不修改对象结构的情况下,给对象结构中的每个元素添加新的功能。访问者模式将数据结构和作用于结构上的操作解耦,使得操作集合可相对自由地演化。 核心概…...
网络六边形受到攻击
大家读完觉得有帮助记得关注和点赞!!! 抽象 现代智能交通系统 (ITS) 的一个关键要求是能够以安全、可靠和匿名的方式从互联车辆和移动设备收集地理参考数据。Nexagon 协议建立在 IETF 定位器/ID 分离协议 (…...
TDengine 快速体验(Docker 镜像方式)
简介 TDengine 可以通过安装包、Docker 镜像 及云服务快速体验 TDengine 的功能,本节首先介绍如何通过 Docker 快速体验 TDengine,然后介绍如何在 Docker 环境下体验 TDengine 的写入和查询功能。如果你不熟悉 Docker,请使用 安装包的方式快…...
工业安全零事故的智能守护者:一体化AI智能安防平台
前言: 通过AI视觉技术,为船厂提供全面的安全监控解决方案,涵盖交通违规检测、起重机轨道安全、非法入侵检测、盗窃防范、安全规范执行监控等多个方面,能够实现对应负责人反馈机制,并最终实现数据的统计报表。提升船厂…...
React19源码系列之 事件插件系统
事件类别 事件类型 定义 文档 Event Event 接口表示在 EventTarget 上出现的事件。 Event - Web API | MDN UIEvent UIEvent 接口表示简单的用户界面事件。 UIEvent - Web API | MDN KeyboardEvent KeyboardEvent 对象描述了用户与键盘的交互。 KeyboardEvent - Web…...
苍穹外卖--缓存菜品
1.问题说明 用户端小程序展示的菜品数据都是通过查询数据库获得,如果用户端访问量比较大,数据库访问压力随之增大 2.实现思路 通过Redis来缓存菜品数据,减少数据库查询操作。 缓存逻辑分析: ①每个分类下的菜品保持一份缓存数据…...
令牌桶 滑动窗口->限流 分布式信号量->限并发的原理 lua脚本分析介绍
文章目录 前言限流限制并发的实际理解限流令牌桶代码实现结果分析令牌桶lua的模拟实现原理总结: 滑动窗口代码实现结果分析lua脚本原理解析 限并发分布式信号量代码实现结果分析lua脚本实现原理 双注解去实现限流 并发结果分析: 实际业务去理解体会统一注…...
实现弹窗随键盘上移居中
实现弹窗随键盘上移的核心思路 在Android中,可以通过监听键盘的显示和隐藏事件,动态调整弹窗的位置。关键点在于获取键盘高度,并计算剩余屏幕空间以重新定位弹窗。 // 在Activity或Fragment中设置键盘监听 val rootView findViewById<V…...
大数据学习(132)-HIve数据分析
🍋🍋大数据学习🍋🍋 🔥系列专栏: 👑哲学语录: 用力所能及,改变世界。 💖如果觉得博主的文章还不错的话,请点赞👍收藏⭐️留言Ǵ…...
用机器学习破解新能源领域的“弃风”难题
音乐发烧友深有体会,玩音乐的本质就是玩电网。火电声音偏暖,水电偏冷,风电偏空旷。至于太阳能发的电,则略显朦胧和单薄。 不知你是否有感觉,近两年家里的音响声音越来越冷,听起来越来越单薄? —…...
【电力电子】基于STM32F103C8T6单片机双极性SPWM逆变(硬件篇)
本项目是基于 STM32F103C8T6 微控制器的 SPWM(正弦脉宽调制)电源模块,能够生成可调频率和幅值的正弦波交流电源输出。该项目适用于逆变器、UPS电源、变频器等应用场景。 供电电源 输入电压采集 上图为本设计的电源电路,图中 D1 为二极管, 其目的是防止正负极电源反接, …...
