鸿蒙Harmony--AppStorage--应用全局的UI状态存储详解

 无所求必满载而归,当你降低期待,降低欲望,往往会得到比较好的结果,把行动交给现在,用心甘情愿的态度,过随遇而安的生活,无论结果如何,都是一场惊喜的获得!

目录

一,定义

二,@StorageProp定义

三,@StorageProp装饰器使用规则说明

四,变量的传递/访问规则说明

五,@StorageLink定义

六,@StorageLink装饰器使用规则说明

七,@StorageLink变量的传递/访问规则说明 

八,AppStorage使用

九,搭配@StorageProp使用

十,搭配@StorageLink使用

十一,注意事项

 

一,定义

AppStorage是应用全局的UI状态存储,是和应用的进程绑定的,由UI框架在应用程序启动时创建,为应用程序UI状态属性提供中央存储。

和AppStorage不同的是,LocalStorage是页面级的,通常应用于页面内的数据共享。而AppStorage是应用级的全局状态共享,还相当于整个应用的“中枢”

AppStorage是在应用启动的时候会被创建的单例。它的目的是为了提供应用状态数据的中心存储,这些状态数据在应用级别都是可访问的。AppStorage将在应用运行过程保留其属性。属性通过唯一的键字符串值访问。

AppStorage可以和UI组件同步,且可以在应用业务逻辑中被访问。

AppStorage支持应用的主线程内多个UIAbility实例间的状态共享。

AppStorage中的属性可以被双向同步,数据可以是存在于本地或远程设备上,并具有不同的功能,比如数据持久化。这些数据是通过业务逻辑中实现,与UI解耦,如果希望这些数据在UI中使用,需要用到@storageProp和@stirageLink。

二,@StorageProp定义

如果要建立AppStorage和自定义组件的联系,需要使用@StorageProp和@StorageLink装饰器。使用@StorageProp(key)/@StorageLink(key)装饰组件内的变量,key标识了AppStorage的属性。

当自定义组件初始化的时候,会使用AppStorage中对应key的属性值将@StorageProp(key)/@StorageLink(key)装饰的变量初始化。由于应用逻辑的差异,无法确认是否在组件初始化之前向AppStorage实例中存入了对应的属性,所以AppStorage不一定存在key对应的属性,因此@StorageProp(key)/@StorageLink(key)装饰的变量进行本地初始化是必要的。

@StorageProp(key)是和AppStorage中key对应的属性建立单向数据同步,允许本地改变,但是对于@StorageProp,本地的修改永远不会同步回AppStorage中,相反,如果AppStorage给定key的属性发生改变,改变会被同步给@StorageProp,并覆盖掉本地的修改。

三,@StorageProp装饰器使用规则说明

@StorageProp变量装饰器说明
装饰器参数key:常量字符串,必填(字符串需要有引号)。
允许装饰的变量类型Object class、string、number、boolean、enum类型,以及这些类型的数组。
类型必须被指定,建议和AppStorage中对应属性类型相同,否则会发生类型隐式转换,从而导致应用行为异常。不支持any,不允许使用undefined和null。
同步类型单向同步:从AppStorage的对应属性到组件的状态变量。
组件本地的修改是允许的,但是AppStorage中给定的属性一旦发生变化,将覆盖本地的修改。
被装饰变量的初始值必须指定,如果AppStorage实例中不存在属性,则作为初始化默认值,并存入AppStorage中。

四,变量的传递/访问规则说明

传递/访问说明
从父节点初始化和更新禁止,@StorageProp不支持从父节点初始化,只能AppStorage中key对应的属性初始化,如果没有对应key的话,将使用本地默认值初始化
初始化子节点支持,可用于初始化@State、@Link、@Prop、@Provide。
是否支持组件外访问否。

注意: 

  • 当装饰的数据类型为boolean、string、number类型时,可以观察到数值的变化。

  • 当装饰的数据类型为class或者Object时,可以观察到赋值和属性赋值的变化,即Object.keys(observedObject)返回的所有属性。

  • 当装饰的对象是array时,可以观察到数组添加、删除、更新数组单元的变化。

  • 当@StorageProp(key)装饰的数值改变被观察到时,修改不会被同步回AppStorage对应属性键值key的属性中。

  • 当前@StorageProp(key)单向绑定的数据会被修改,即仅限于当前组件的私有成员变量改变,其他的绑定该key的数据不会同步改变。

  • 当@StorageProp(key)装饰的数据本身是状态变量,它的改变虽然不会同步回AppStorage中,但是会引起所属的自定义组件的重新渲染。

  • 当AppStorage中key对应的属性发生改变时,会同步给所有@StorageProp(key)装饰的数据,@StorageProp(key)本地的修改将被覆盖。

五,@StorageLink定义

@StorageLink(key)是和AppStorage中key对应的属性建立双向数据同步:

  1. 本地修改发生,该修改会被写回AppStorage中;

  2. AppStorage中的修改发生后,该修改会被同步到所有绑定AppStorage对应key的属性上,包括单向(@StorageProp和通过Prop创建的单向绑定变量)、双向(@StorageLink和通过Link创建的双向绑定变量)变量和其他实例(比如PersistentStorage)。

六,@StorageLink装饰器使用规则说明

@StorageLink变量装饰器说明
装饰器参数key:常量字符串,必填(字符串需要有引号)。
允许装饰的变量类型Object、class、string、number、boolean、enum类型,以及这些类型的数组。
类型必须被指定,建议和AppStorage中对应属性类型相同,否则会发生类型隐式转换,从而导致应用行为异常。不支持any,不允许使用undefined和null。
同步类型双向同步:从AppStorage的对应属性到自定义组件,从自定义组件到AppStorage对应属性。
被装饰变量的初始值必须指定,如果AppStorage实例中不存在属性,则作为初始化默认值,并存入AppStorage中。

七,@StorageLink变量的传递/访问规则说明 

传递/访问说明
从父节点初始化和更新禁止。
初始化子节点支持,可用于初始化常规变量、@State、@Link、@Prop、@Provide。
是否支持组件外访问否。

 注意:

  • 当装饰的数据类型为boolean、string、number类型时,可以观察到数值的变化。

  • 当装饰的数据类型为class或者Object时,可以观察到赋值和属性赋值的变化,即Object.keys(observedObject)返回的所有属性。

  • 当装饰的对象是array时,可以观察到数组添加、删除、更新数组单元的变化。

  • 当@StorageLink(key)装饰的数值改变被观察到时,修改将被同步回AppStorage对应属性键值key的属性中。

  • AppStorage中属性键值key对应的数据一旦改变,属性键值key绑定的所有的数据(包括双向@StorageLink和单向@StorageProp)都将同步修改;

  • 当@StorageLink(key)装饰的数据本身是状态变量,它的改变不仅仅会同步回AppStorage中,还会引起所属的自定义组件的重新渲染。

八,AppStorage使用

//创建AppStorage key为yuanzhen value 222
AppStorage.SetOrCreate<number>("yuanzhen",222)
//获取属性为yuanzhen的AppStorage的value
AppStorage.Get("yuanzhen")
//设置AppStorage属性为yuanzhen的值为666  如果没有创建过 则不执行
AppStorage.Set<number>("yuanzhen",666)

九,搭配@StorageProp使用

父组件

import ProvideTest from './ProvideTest';
AppStorage.SetOrCreate<number>("yuanzhen",222)@Entry()
@Component
struct Index {@StorageProp("yuanzhen") yuanzhen:number =888build() {Column(){Text("父name:" + this.yuanzhen).fontSize(50).fontWeight(FontWeight.Bold).onClick(() => {this.yuanzhen=999})ProvideTest()}}
}

子组件

@Component
export default struct ProvideTest {@StorageProp("yuanzhen")yuanZhen:number =1000build() {Row() {Column() {Text("子name:"+this.yuanZhen).fontSize(50).fontWeight(FontWeight.Bold).onClick(() => {this.yuanZhen=123456})}.width('100%')}.height('100%')}
}

运行

点击父点击子

初始化的时候,都是获取的初始的值222,点击父,只改变自己的值,点击子也只改变自己的值,不改变父的值。

十,搭配@StorageLink使用

父组件

import ProvideTest from './ProvideTest';
AppStorage.SetOrCreate<number>("yuanzhen",222)@Entry()
@Component
struct Index {@StorageLink("yuanzhen") yuanzhen:number =888build() {Column(){Text("父name:" + this.yuanzhen).fontSize(50).fontWeight(FontWeight.Bold).onClick(() => {this.yuanzhen=999})ProvideTest()}}
}

子组件

@Component
export default struct ProvideTest {@StorageLink("yuanzhen")yuanZhen:number =1000build() {Row() {Column() {Text("子name:"+this.yuanZhen).fontSize(50).fontWeight(FontWeight.Bold).onClick(() => {this.yuanZhen=123456})}.width('100%')}.height('100%')}
}

运行:

点击父点击子

双向同步,子组件修改,会导致AppStorage里面的值修改

十一,注意事项

AppStorage与PersistentStorage以及Environment配合使用时,需要注意以下几点:

  • 在AppStorage中创建属性后,调用PersistentStorage.persistProp()接口时,会使用在AppStorage中已经存在的值,并覆盖PersistentStorage中的同名属性,所以建议要使用相反的调用顺序

  • 如果在AppStorage中已经创建属性后,再调用Environment.envProp()创建同名的属性,会调用失败。因为AppStorage已经有同名属性,Environment环境变量不会再写入AppStorage中,所以建议AppStorage中属性不要使用Environment预置环境变量名。

  • 状态装饰器装饰的变量,改变会引起UI的渲染更新,如果改变的变量不是用于UI更新,只是用于消息传递,推荐使用 emitter方式。

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

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

相关文章

文献阅读:Large Language Models as Optimizers

文献阅读&#xff1a;Large Language Models as Optimizers 1. 文章简介2. 方法介绍 1. OPRO框架说明2. Demo验证 1. 线性回归问题2. 旅行推销员问题&#xff08;TSP问题&#xff09; 3. Prompt Optimizer 3. 实验考察 & 结论 1. 实验设置2. 基础实验结果 1. GSM8K2. BBH3.…

多测师肖sir___ui自动化测试po框架讲解版

po框架 一、ui自动化po框架介绍 &#xff08;1&#xff09;PO是Page Object的缩写&#xff08;pom模型&#xff09; &#xff08;2&#xff09;业务流程与页面元素操作分离的模式&#xff0c;可以简单理解为每个页面下面都有一个配置class&#xff0c; 配置class就用来维护页面…

如何用GPT/GPT4进行AI绘图?

详情点击链接&#xff1a;如何用GPT/GPT4进行AI绘图&#xff1f; 一OpenAI 1.最新大模型GPT-4 Turbo 2.最新发布的高级数据分析&#xff0c;AI画图&#xff0c;图像识别&#xff0c;文档API 3.GPT Store 4.从0到1创建自己的GPT应用 5. 模型Gemini以及大模型Claude2二定制自…

HCIA的网络地址转换NAT

NAT&#xff1a;网络地址转换 功能&#xff1a; 1.将大量的私有地址转换成公有地址&#xff08;节约IP地址&#xff09; 2.将一个IP地址转换成另一个IP地址&#xff08;公有的&#xff09;&#xff08;增加内部网络设备的安全性&#xff09;&#xff1a;比如有一个内网&#xf…

Python学习从0到1 day4 python格式化输出和输入方法

其实我不是我&#xff0c;我是青山辽阔 ——24.1.14 一、百分号形式的格式化输出 1.普通输出 #1.定义一些变量 name 陈浩南 age 25 address 广州市天河区#2.变量的输出&#xff08;普通输出&#xff09; print(name) print(age) print(address)#3.Python中&#xff0c;还允…

论文阅读:Attention is all you need

【最近课堂上Transformer之前的DL基础知识储备差不多了&#xff0c;但学校里一般讲到Transformer课程也接近了尾声&#xff1b;之前参与的一些科研打杂训练了我阅读论文的能力和阅读源码的能力&#xff0c;也让我有能力有兴趣对最最源头的论文一探究竟&#xff1b;我最近也想按…

Vue2-Vuex中State、Mutation及mapState辅助函数、mapMutations的基本用法

Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。它采用集中式存储管理应用的所有组件的状态&#xff0c;并以相应的规则保证状态以一种可预测的方式发生变化。 个人笔记&#xff0c;仅供参考。 state&#xff1a;全局共享的响应式数据 mutation:声明修改全局响应式数据…

分数1/1-1/2+1/3-1/4+1/5 …… + 1/99 - 1/100 求和

要求&#xff1a;计算1/1-1/21/3-1/41/5 …… 1/99 - 1/100 的值&#xff0c;打印出结果。 法一&#xff1a; 从要求&#xff0c;我们可以看出&#xff0c;计算内容分为正数和负数。对他们求和&#xff0c;可以通过分别求和再相加。 #include<stdio.h> int main() {fl…

9.云原生存储之ceph在k8s中应用及问题处理

云原生专栏大纲 文章目录 ceph应用场景ceph应用在k8s集群外使用块设备ceph客户端配置创建块挂载使用删除pool 在k8s集群内使用块设备创建块池和StorageClass使用存储 块存储映射问题处理问题现象事件分析csi-rbdplugin pod日志分析问题小结CentOS 7 编译安装 nbd 模块nbd内核模…

Chapter 9 运算符重载

目的&#xff1a;运用运算符重载 &#x1f353;&#x1f353;&#x1f353;&#x1f353;&#x1f353;&#x1f353;&#x1f353;&#x1f353;&#x1f353;&#x1f353;&#x1f353;&#x1f353;&#x1f353;&#x1f353;&#x1f353;&#x1f353;&#x1f353;&…

MySQL8密码重置——Windows环境

1. 环境变量配置 加入操作会方便点&#xff0c;不用每次都要进入其安装目录 Path环境变量加入&#xff1a;%MYSQL_HOME%\bin 2. 停掉服务及服务安装 3. 创建my.ini MySQL安装目录&#xff08;C:\Program Files\MySQL\MySQL Server 8.0&#xff09;下创建my.ini文件 my.ini文…

有哪些品牌的超声波清洗机是值得入手的?超声波清洗机推荐

作为一个既对生活品质有追求&#xff0c;又只想躺平的懒人&#xff0c;一直在努力尝试让轻松的生活少一点绊脚石&#xff0c;而其中最重要的一个&#xff0c;就是清洗眼镜清洗日常生活的一些小物件&#xff0c;讲真&#xff0c;洗这些东西有时候就跟下班回家的KPI一样。白天不累…

《吐血整理》保姆级系列教程-玩转Fiddler抓包教程(6)-Fiddler状态面板详解

1.简介 按照从上往下&#xff0c;从左往右的计划&#xff0c;今天就轮到介绍和分享Fiddler的状态面板了。 2.状态面板概览 Fiddler的状态面板概览&#xff0c;如下图所示&#xff1a; 3.状态面板详解 Fiddler底端状态栏面板详解&#xff0c;如下图所示&#xff1a; 3.1Captu…

重新分区扩展C盘

电脑 – 管理 使用第三方工具&#xff1a;DiskGenius数据恢复及分区管理软件 要选择完成后重启 &#xff0c;如果这里忘记勾选&#xff0c;后面也会再次提醒并默认勾选重启 "调整后容量"是指图片上显示的非C盘之外的盘符的容量&#xff0c;这里指E盘大小 上面已经利…

vue知识-05

聊天室案例(django接口) # chat.hetm<<script src"/static/axios.js"></script><script src"/static/vue.js"></script><body> <div id"app"><h1>聊天室</h1><button click"handleS…

从事铁路工作保护足部,穿什么劳保鞋更安全

铁路运输在我国交通运输业中起着骨干作用&#xff0c;为国民经济的可持续发展和人口流动做出了巨大贡献。安全是铁路运输不可忽视的问题&#xff0c;在作业场地随处能见到“安全就是生命&#xff0c;责任重于泰山”的安全标语&#xff0c;由此可见安全问题是放在首位的。 铁路施…

PyTorch深度学习实战(30)——Deepfakes

PyTorch深度学习实战&#xff08;30&#xff09;——Deepfakes 0. 前言1. Deepfakes 原理2. 数据集分析3. 使用 PyTorch 实现 Deepfakes3.1 random_warp.py3.2 Deepfakes.py 小结系列链接 0. 前言 Deepfakes 是一种利用深度学习技术生成伪造视频和图像的技术。它通过将一个人的…

学习Vue配置代理总结

今天学习了Vue的配置代理&#xff0c;当我们想要向服务器取回来数据时就先要向服务器发送请求&#xff0c;但前端发送请求的方式也有很多种&#xff0c;首先是发送请求的鼻祖JS的XMLHttpRequest&#xff08;xhr&#xff09;&#xff0c;它操作起来相对麻烦&#xff0c;开发中也…

SpringBoot自定义Starter(@EnableXXX和META-INF的SPI自动添加)

目录 1. 自定义Starter1.1 场景和效果1.2 starter实现1.2.1 创建自定义starter项目1.2.2 把所有maven依赖导入1.2.3 实现公共代码逻辑1.2.4 添加方式一&#xff1a;实现RobotAutoConfiguration配置类1.2.5 添加方式二&#xff1a;实现RobotAutoConfiguration配置类 EnableRobo…

Linux下如何快速调试I2C设备

Linux下如何快速调试I2C设备 目录 1 什么场景下需要快速调试I2C设备 2 如何快速调试I2C设备 3 如何获取I2C Tools工具集 3.1 获取I2C Tools工具集源码 3.2 编译I2C Tools工具集源码 3.3 为设备添加I2C Tools工具集 4 如何使用I2C Tools工具集 5 小结 1 什么场景下需要快…