HarmonyOS(33) @LocalStorageProp使用指南

news2024/11/15 4:20:05

LocalStorageProp使用指南

  • 说明
  • 使用示例
  • 参考资料

说明

不同于@LocalStorageLink与LocalStorage建立的双向同步关系,@LocalStorageProp装饰的变量与LocalStorage中给定属性建立单向同步关系。@LocalStorageProp(key)是和LocalStorage中key对应的属性建立单向数据同步,ArkUI框架支持修改@LocalStorageProp(key)在本地的值,但是对本地值的修改不会同步回LocalStorage中。相反,如果LocalStorage中key对应的属性值发生改变,例如通过set接口对LocalStorage中的值进行修改,或者通过@LocalStorageLink修改了LocalStorage的值,改变会同步给@LocalStorageProp(key),并覆盖掉本地的值。
在这里插入图片描述

使用示例

下面的代码中:

  • Child使用 @LocalStorageProp与LocalStorage中的’Prop’属性建立单向绑定。
  • Parent使用 @LocalStorageLink变量装饰器与LocalStorage中的’Prop’属性建立双向绑定

let storage: LocalStorage = new LocalStorage();

struct Child {
  // @LocalStorageProp变量装饰器与LocalStorage中的'Prop'属性建立单向绑定
  ('Prop') childLinkNumber: number = 1;
  build() {
    Button(`Child Value ${this.childLinkNumber}`) // 更改将同步至LocalStorage中的'PropA'以及Parent.parentLinkNumber
      .onClick(() => {
        this.childLinkNumber += 1;
      })
  }
}
// 使LocalStorage可从@Component组件访问
(storage)

struct Parent {
  // @LocalStorageLink变量装饰器与LocalStorage中的'Prop'属性建立双向绑定
  ('Prop') parentLinkNumber: number = 1;

  build() {
    Column({ space: 15 }) {
      Button(`Parent value  ${this.parentLinkNumber}`)
        .backgroundColor(Color.Red)
        .onClick(() => {
          this.parentLinkNumber += 1;
        })
      // @Component子组件自动获得对CompA LocalStorage实例的访问权限。
      Child()
    }.alignItems(HorizontalAlign.Center)
    .width('100%')
    .margin({top:200})
  }
}

  • 点击红色parent按钮,蓝色child按钮的值会跟着一起变化(如下图)
    在这里插入图片描述

  • 点击蓝色child按钮,红色parent按钮的数值不会变化(如下图)
    在这里插入图片描述

  • 此时再点击红色parent按钮,则child又变成了6.(如下图)
    在这里插入图片描述

参考资料

LocalStorage:页面级UI状态存储
HarmonyOS(30) @LocalStorageLink使用指南

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

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

相关文章

SD3303A 大功率高亮度LED驱动芯片IC

一般描述 SD3303A是一款大功率高亮度LED驱动芯片,可以提供1A的电流驱动3W的LED。具有高效率,低功耗等特点,适用于电池供电的LED照明设备。 SD3303A具有开路保护和过温保护。 SD3303A需要使用两颗10uF(或者更大)的瓷片电容,来保…

如何理解质量

早年写过一篇未发表的论文《质量的相对性》,就是为了寻求到底什么才是质量这个问题的答案。现在,在准备了诸多超越以往的认知的概念之后,关于质量是什么的想法,也逐渐有了眉目。 质量有两种,一种叫做惯性质量&#xff…

Docker大学生看了都会系列(九、Docker使用Buildx构建不同CPU架构镜像)

系列文章目录 第一章 Docker介绍 第二章 2.1 Mac通过Homebrew安装Docker 第二章 2.2 CentOS安装Docker 第三章 Docker常用命令 第四章 常用命令实战 第五章 Docker镜像详解 第六章 Docker容器数据卷 第七章 Dockerfile详解 第八章 Dokcerfile部署go项目 第九章 Docker使用Build…

【云岚到家】-day02-4-我的账户-实名认证

【云岚到家】-day02-4-我的账户-实名认证 1 我的账户设置-实战1.1 配置OSS1.2 需求分析1.2.1 服务端设置银行账户1.2.2 机构端设置银行账户1.2.3 表结构设计1.2.4 表结构相关的controller、service、mapper、entity 1.3 服务端设置银行账户接口设计1.3.1 新增或更新银行账号信息…

【WWDC 2024 发表会懒人包】iOS 18、iPadOS 18、macOS 15、Apple Intelligence 重点一次看

苹果今天(6/11)发布了全新iOS 18、iPadOS 18、macOS 15、watchOS 11以及visionOS 2,这次的WWDC大会首场发表会久违的快要2 个小时,下面就带大家来看看最新的iOS 18、iPadOS 18、macOS 15、watchOS 11、visionOS 2 特色功能懒人包。…

【FreeRTOS】源码概述

FreeRTOS源码概述 参考《FreeRTOS入门与工程实践(基于DshanMCU-103)》里《第7章 FreeRTOS源码概述》 相关文章:http://t.csdnimg.cn/QK0aO 1 FreeRTOS目录结构 使用 STM32CubeMX 创建的 FreeRTOS 工程中, FreeRTOS 相关的源码如下: 主要设计两个目录 C…

第2章 Rust初体验2/8:变量值绑定:默认不可变增强代码安全性:猜骰子冷热游戏

讲动人的故事,写懂人的代码 2.3.6 变量值绑定:默认不可变增强代码安全性 赵可菲:“那句给 guess 赋值的,没特别写出类型来,看起来Rust是自动帮我们搞定类型判断的吧。” let mut guess = String::new();贾克强:“对啊,Rust会自动帮我们做类型推断(type inference),这…

Linux 基本指令1

ls指令 ls【-选项】【目录或文件】当不指定目录或文件时指令能列出当前目录下所有文件除隐藏文件 选项: -a 列出所有包括隐藏的文件-隐藏文件以.开头。 -d 将目录如文件般显示-一般用ls显示目录是显示其目录中所有文件,加-d则显示目录的信息 -r 以反…

【数据结构】单链表(C语言)

在数据结构和算法中,链表是一种常见的数据结构,它由一系列节点组成,每个节点包含数据和指向下一个节点的指针。在C语言中,我们可以使用指针来实现单向链表。下面将详细讲述如何利用C语言实现单向链表。 1.单链表的概念和结构 概…

C++发送邮件的性能如何优化?有哪些方法?

C发送邮件怎么配置SMTP服务器?如何使用C库发信? 在现代应用程序中,电子邮件发送是一个常见的功能。尤其对于需要发送大量邮件的企业级应用,优化邮件发送性能变得尤为重要。AokSend将探讨在使用C发送邮件时,如何通过各…

电脑想加个WIFI功能,怎么选!

在快速发展的物联网和智能家居时代,Wi-Fi模块作为连接各类智能设备与互联网的桥梁,其重要性不言而喻。而为了让这些模块能够适应各式各样的应用场景,不同的接口技术应运而生。今天,我们就来深入浅出地探讨几种常见的Wi-Fi模块接口,包括它们的工作原理、特点以及适用场景,…

Docker以挂载方式安装RocketMQ

Docker 挂载安装RocketMQ Docker 挂载安装RocketMQ安装 Docker安装NameServer1.拉取容器2.创建NameServer容器3.查看容器状态 安装 broker创建 broker.conf 文件启动容器 安装RocketMQ-console构建镜像启动容器开通安全组策略访问控制台 Docker 挂载安装RocketMQ 在 Docker 中…

LangChain入门学习笔记(二)——LangChain表达式语言(LCEL)

基于LangChain框架编写大模型应用的过程就像垒积木,其中的积木就是Prompts,LLMs和各种OutputParser等。如何将这些积木组织起来,除了使用基本Python语法调用对应类的方法,一种更灵活的方法就是使用位于LangChain-Core层中的LCEL&a…

python的四个进度条

哈喽,我是快乐吗喽,今天简单的给大家介绍一下python的四个进度条工具,希望各位喜欢。 第一个进度条工具tqdm,好记点我叫她淘气大妈 安装tqdm库 pip install tqdm 基本用法 from tqdm import tqdm import timefor i in tqdm(ran…

SpringBoot2+Vue3开发课程审核流程系统

SpringBoot2Vue3开发课程审核流程系统 简介 此系统实现了课程审核全流程功能并使用了Activiti7工作流技术,功能包含:课程管理、用户管理、流程定义、课程审核(我的申请、我的代办、我的已办) 功能介绍 课程管理 对课程信息的管…

录音转文字软件:一键让工作学习更高效

在职场这个大舞台上,每一场会议都是关键的演出,而会议记录就是这场演出的剧本。但剧本要整理得好,才能让演出更精彩,不是吗? 把那些长串的会议音频变成清晰的文字记录,听起来就像变魔术一样难。但不用担心…

人工智能强化学习:核心内容、社会影响及未来展望

欢迎来到 Papicatch的博客 文章目录 🐋引言 🐋强化学习的核心内容 🦈强化学习基本概念 🐋强化学习算法 🦈Q学习(Q-Learning) 🦈深度Q网络(Deep Q-Network, DQN&…

AI日报|苹果生态全面整合AI功能,字节跳动被曝秘密启动AI手机研发

文章推荐 粽叶飘香,端午安康!AI视频送祝福啦~ 谁是最会写作文的AI“考生”?“阅卷老师”ChatGPT直呼惊艳! ⭐️搜索“可信AI进展“关注公众号,获取当日最新AI资讯 苹果WWDC 2024:AI为苹果带来了什么&am…

24年系统架构设计师考试真题大放送

哈喽,简单介绍一下,我是研究系统架构设计师/系统分析师考试3 年,累计帮助千人备考系统架构设计师的——凯恩。芝士架构刷题免费!芝士架构 | 软考备考第一站 这周,凯恩抽空把2024年系统架构设计师真题的选择题&#xff…

【qt】视口和窗口坐标

视口和窗口坐标 一.视口和窗口坐标的原理二.视口和窗口坐标的好处三.演示好处四.总结 一.视口和窗口坐标的原理 在绘图事件中进行绘图 void Widget::paintEvent(QPaintEvent *event) {QPainter painter(this);QRect rect(200,0,200,200);painter.drawRect(rect);//设置视口的…