赞
踩
LocalStorage是ArkTS为构建页面级别状态变量提供存储的内存内“数据库”。
1.LocalStorage实例可以在 "页面(一个页面)内" 共享
2.LocalStorage中的所有属性都是可变的
3.@LocalStorageProp:@LocalStorageProp装饰的变量和与LocalStorage中给定属性建立 单向同步关系。状态变量修改不同步更新。
@LocalStorageLink:@LocalStorageLink装饰的变量和在@Component中创建与LocalStorage中给定属性建立 双向同步关系。状态变量修改同步更新。
4.类型必须被指定,且必须和LocalStorage中对应属性相同。不支持any,不允许使用undefined和null。
1.创建新实例并使用给定对象初始化:
let storage = new LocalStorage({ 'PropA': 47 });
2.注入实例:
@Entry(storage)
3. @LocalStorageLink变量装饰器声明新变量storLink1与LocalStorage中的'PropA'属性建立双向绑定:
@LocalStorageLink('PropA') storLink1: number = 1;
- // 创建新实例并使用给定对象初始化
- let storage = new LocalStorage({ 'PropA': 47 });
-
- @Entry(storage) // 使LocalStorage可从@Component组件访问---注入实例
- @Component
- struct LocalStoragePage {
- // @LocalStorageLink变量装饰器声明新变量storLink1与LocalStorage中的'PropA'属性建立双向绑定
- @LocalStorageLink('PropA') storLink1: number = 1;
-
- build() {
-
- Column() {
- Text('-------LocalStorage-------').fontColor(Color.Red).fontSize(24)
- Text(`storLink1: ${this.storLink1}`).fontSize(20).fontWeight(600)
- .onClick(() => {
- this.storLink1++;
- })
- Button('修改')
- .onClick(() => {
- storage.set('PropA', 100)
- })
- ComA()
- }
- .width('100%').padding(20).justifyContent(FlexAlign.Start).alignItems(HorizontalAlign.Start)
-
- }
- }
-
- @Component
- struct ComA {
- build() {
- Column() {
- Text(`ComA`)
- ComB()
- }.justifyContent(FlexAlign.Start).alignItems(HorizontalAlign.Start)
- }
- }
-
- @Component
- struct ComB {
- @LocalStorageLink('PropA') storLink2: number = 1; //双向
- @LocalStorageProp('PropA') storLink3: number = 1; //单向
-
- build() {
- Column() {
- Text(`ComB_link: ${this.storLink2}`)
- .onClick(() => {
- this.storLink2 += 10
- })
- Text(`ComB_prop: ${this.storLink3}`)
- .onClick(() => {
- this.storLink3 += 10
- })
- }
- }
- }
1.AppStorage是应用级的全局状态共享
2.@StorageProp:单向同步:从AppStorage的对应属性到组件的状态变量。组件本地的修改是允许的,但是AppStorage中给定的属性一旦发生变化,将覆盖本地的修改。
@StorageLink:双向同步:从AppStorage的对应属性到自定义组件,从自定义组件到AppStorage对应属性。
3.类型必须被指定,且必须和LocalStorage中对应属性相同。不支持any,不允许使用undefined和null。
1.创建新实例并使用给定对象初始化:
AppStorage.SetOrCreate('PropA', 48);
2.注入实例:
@Entry(storage)
3. @StorageLink变量装饰器声明新变量appLink1与AppStorage中的'PropA'属性建立双向绑定:
@StorageLink('PropA') appLink1: number = 1;
- import router from '@ohos.router';
- // 全局
- AppStorage.SetOrCreate('PropA', 48);
-
- @Entry(storage) // 使LocalStorage可从@Component组件访问---注入实例
- @Component
- struct LocalStoragePage {
- @StorageLink('PropA') appLink1: number = 1;
-
- build() {
-
- Column() {
- Text('-------appStorage-------').fontColor(Color.Red).fontSize(24)
- Text(`storLink1: ${this.appLink1}`).fontSize(20).fontWeight(600)
- .onClick(() => {
- this.appLink1++;
- })
- Button('修改')
- .onClick(() => {
- AppStorage.SetOrCreate('PropA', 100)
- })
- Button('跳转')
- .onClick(() => {
- router.pushUrl({ url: 'pages/Index' })
- })
-
- }
- .width('100%').padding(20).justifyContent(FlexAlign.Start).alignItems(HorizontalAlign.Start)
-
- }
- }
pages/Index页面:
- //导入页面路由模块
- import router from '@ohos.router';
-
- @Entry
- @Component
- struct Index {
- // 全局
- @StorageLink('PropA') propa: number = 1;
-
- build() {
-
- Column() {
- Text(`appStorage: ${this.propa}`)
- .onClick(() => {
- this.propa++
- })
- Button('返回').onClick(()=>{
- router.back();
- })
-
- }
- .width('100%')
-
- }
- }
1.UI和业务逻辑不直接访问PersistentStorage中的属性,所有属性访问都是对AppStorage的访问,AppStorage中的更改会自动同步到PersistentStorage
2.PersistentStorage和AppStorage中的属性建立双向同步
3.限制条件:不支持嵌套对象(对象数组,对象的属性是对象等);不支持undefined 和 null
4.PersistentStorage的持久化变量最好是小于2kb的数据
5.PersistentStorage只能在UI页面内使用,否则将无法持久化数据
1.初始化PersistentStorage属性,此时AppStorage中也生成一个Address属性
PersistentStorage.PersistProp('Address', "");
2.在AppStorage获取对应属性
AppStorage.Get('aProp');
或在组件内部定义:
@StorageLink('Address') address: string = "";
- PersistentStorage.PersistProp('aProp', 47);
-
- @Entry
- @Component
- struct Index {
- @State message: string = 'Hello World'
- @StorageLink('aProp') aProp: number = 48
-
- build() {
- Row() {
- Column() {
- Text(this.message)
- // 应用退出时会保存当前结果。重新启动后,会显示上一次的保存结果
- Text(`${this.aProp}`)
- .onClick(() => {
- this.aProp += 1;
- })
- }
- }
- }
- }
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。