最简单的vue3组件之间传值

localStorage 是 HTML5 引入的一个 Web Storage API 的一部分,它允许网页在用户的浏览器上存储数据。localStorage 提供了一种持久化的本地存储方案,数据不会因为浏览器关闭而丢失,除非用户或脚本显式地删除它们。

localStorage 是一种非常实用的前端存储技术,尤其适合那些不需要服务器交互就可以持久化存储的数据场景。

特点

  • 持久性:存储在 localStorage 中的数据会一直保留,直到被用户或脚本明确清除。
  • 容量大:相较于 cookies,localStorage 提供了更大的存储空间,一般为 5MB 左右,具体取决于浏览器实现。
  • 键值对存储:数据以键值对的形式存储,键和值都是字符串。
  • 安全性:存储在 localStorage 中的数据只能被同一源策略下的脚本访问,即同源策略限制了跨域数据访问。

基本用法

localStorage.setItem('key', 'value');const value = localStorage.getItem('key');localStorage.removeItem('key');localStorage.clear();

生命周期

localStorage 中的数据生命周期很长,除非用户手动清理浏览器缓存或脚本调用 clear() 或 removeItem() 方法,否则数据将永久保存。

例如

存储

获得

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

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

VSCode神仙插件——通义灵码 (AI编程助手)

1、安装&登录插件 安装时,右下角会有弹窗,让你登录该软件 同意登录后,会跳转浏览器页面 VSCode右下角出现如下图标即登录成功 2、使用 (1)点击左侧栏中的如下图标,打开通义灵码,可以进行智能问答 (2) 选中代码,右键 但是,上述所有的操作会在左侧问答栏中提供答案,并无法直…

认识并理解webSocket

今天逛牛客,看到有大佬分享说前端面试的时候遇到了关于webSocket的问题,一看自己都没见过这个知识点,赶紧学习一下,在此记录! WebSocket 是一种网络通信协议,提供了全双工通信渠道,即客户端和服…

31. 1049. 最后一块石头的重量 II, 494.目标和,474.一和零

class Solution { public:int lastStoneWeightII(vector<int>& stones) {int sum 0;for(int stone : stones) sum stone;int bagSize sum /2;vector<int> dp(bagSize 1, 0);for(int i 0; i < stones.size(); i){ //遍历物品for(int j bagSize; j >…

LLMs的基本组成:向量、Tokens和嵌入

编者按&#xff1a;随着人工智能技术的不断发展&#xff0c;大模型&#xff08;语言、视觉&#xff0c;或多模态模型&#xff09;已成为当今AI应用的核心组成部分。这些模型具有处理和理解自然语言等模态输入的能力&#xff0c;推动了诸如聊天机器人、智能助手、自动文本生成等…

Android初学者书籍推荐

书单 1.《Android应用开发项目式教程》&#xff0c;机械工业出版社&#xff0c;2024年出版2.《第一行代码Android》第二版3.《第一行代码Android》第三版4.《疯狂Android讲义》第四版5.《Android移动应用基础教程&#xff08;Android Studio 第2版&#xff09;》 从学安卓到用安…

Node.js如何在Windows安装?

文章目录 主要特点&#xff1a;使用场景&#xff1a;安装方法验证是否安装成功 Node.js 是一个开源、跨平台的JavaScript运行环境&#xff0c;由Ryan Dahl于2009年创建。它允许开发者在服务器端运行JavaScript代码。Node.js 基于Chrome V8 JavaScript引擎构建&#xff0c;其设计…

项目/代码规范与Apifox介绍使用

目录 目录 一、项目规范&#xff1a; &#xff08;一&#xff09;项目结构&#xff1a; &#xff08;二&#xff09;传送的数据对象体 二、代码规范&#xff1a; &#xff08;一&#xff09;数据库命名规范&#xff1a; &#xff08;二&#xff09;注释规范&#xff1a; …

关于CANNM PassiveMode

Passive Mode的要求 根据上图CANNM的规范可知&#xff1a; 处于Passive Mode的网络节点只能接收网络管理PDU&#xff0c;不能发送网络管理PDU。Passive Mode由CanNmPassiveModeEnable参数静态配置。如果一个ECU包含多个节点&#xff0c;那么所有的节点要么都是Passive Mode要么…

GD32F303之CAN通信

1、CAN时钟 GD32F303主时钟频率最大是120Mhz,然后APB1时钟最大是60Mhz,APB2时钟最大是120Mhz,CAN挂载在APB1总线上面 所以一般CAN的时钟频率是60Mhz,这个频率和后面配置波特率有关 2、GD32F303时钟配置 首先我们知道芯片有几个时钟 HXTAL&#xff1a;高速外部时钟&#xff1…

elementui实现复杂表单的实践

简介 文章主要讲述在vue3项目中使用elementui框架实现复杂表单的方式。表单中涉及动态组件的生成、文件上传和富文本编辑器的使用&#xff0c;只会将在实现过程中较复杂的部分进行分享&#xff0c;然后提供一份完整的前端代码。 表单效果演示 基础信息 spu属性 sku详情 关键…

曝宝马汽车门店亏损严重价格战带来的伤害太大了

今年以来不仅餐饮行业难,就连一些车企都陷入困境当中,多家车企选择打价 格战。只不过日前的时候媒体爆料称,宝马汽车门店因为打价格战,最终亏损严 重,为了避免亏损再度出现,因此宝马7月将会开始降量保价。文章来源于&#xff1a;股城网www.gucheng.com 实际上,进入2024年…

如何在 C 语言中进行选择排序?

&#x1f345;关注博主&#x1f397;️ 带你畅游技术世界&#xff0c;不错过每一次成长机会&#xff01; &#x1f4d9;C 语言百万年薪修炼课程 通俗易懂&#xff0c;深入浅出&#xff0c;匠心打磨&#xff0c;死磕细节&#xff0c;6年迭代&#xff0c;看过的人都说好。 文章目…

B站大课堂-自动化精品视频(个人存档)

基础知识 工业通信协议 Modbus 施耐德研发&#xff0c;有基于以太网的 ModbusTCP 协议和使用 485/232 串口通信的 ModbusRTU/ASCII。 Modbus 协议面世较早、协议简洁高效、商用免费、功能灵活、实现简单&#xff0c;是目前应用最广泛的现场总线协议。 我的笔记里边有一些推荐…

本地开发微信小程序,使用巴比达内网穿透

在微信小程序开发的热潮中&#xff0c;开发者常面临的一个挑战是如何在复杂的网络环境下测试和调试内网环境中的服务。巴比达正为这一难题提供了一条解决方案&#xff0c;极大简化了微信小程序与内网服务器之间通信的流程&#xff0c;加速了开发迭代周期。 以往&#xff0c;开…

关于力反馈设备应用方向的探讨

力反馈是在虚拟现实 (VR)等模拟环境中通过机动运动或阻力模拟真实世界的物理触觉。大多数人都是通过视频游戏控制器&#xff08;如方向盘或踏板&#xff09;和其他设备&#xff08;如飞行模拟器操纵杆&#xff09;来了解力反馈效果。但我们都知道该技术的用途远不止于游戏。 触…

Golang语法规范和风格指南(一)——简单指南

1. 前引 一个语言的规范的学习是重要的&#xff0c;直接关系到你的代码是否易于维护和理解&#xff0c;同时学习好对应的语言规范可以在前期学习阶段有效规避该语言语法和未知编程风格的冲突。 这里是 Google 提供的规范&#xff0c;有助于大家在开始学习阶段对 Golang 进行一…

基于 BERT 的非结构化领域文本知识抽取

文章目录 题目摘要方法实验 题目 食品测试的大型语言模型 论文地址&#xff1a;https://arxiv.org/abs/2103.00728 摘要 随着知识图谱技术的发展和商业应用的普及&#xff0c;从各类非结构化领域文本中提取出知识图谱实体及关系数据的需求日益增加。这使得针对领域文本的自动化…

【UE5】调用ASR接口,录制系统输出。录制音频采样率不匹配

暂时测出window能用。阿里的ASR接口当前仅支持8000和16000。UE默认采样44100。

MES系统助力塑料制品行业数字化转型

注塑MES系统助力工厂生产力提升具体体现在&#xff1a;覆盖生产全流程&#xff1b;数据自动收集、科学规划排产&#xff1b;优化配送模型、平衡物流运转&#xff1b;严格把控品质、异常自动分析&#xff1b;实时监控设备&#xff0c;保证正常运转&#xff1b;产品快速追溯&…

教学神器大比拼:SmartEDA、Multisim、Proteus,谁是你的最佳选择?

随着科技的飞速发展&#xff0c;教学工具也在不断升级。在电子设计自动化&#xff08;EDA&#xff09;和电路仿真领域&#xff0c;SmartEDA、Multisim和Proteus三款软件备受关注。那么&#xff0c;对于广大教育工作者和学生们来说&#xff0c;这三者之间该如何选择呢&#xff1…