HarmonyOS鸿蒙Next中应用及变量的状态管理

HarmonyOS鸿蒙Next中应用及变量的状态管理 API：https://developer.huawei.com/consumer/cn/doc/harmonyos-references/ts-state-management

LocalStorage指南：https://developer.huawei.com/consumer/cn/doc/harmonyos-guides/arkts-localstorage

AppStorage指南：https://developer.huawei.com/consumer/cn/doc/harmonyos-guides/arkts-appstorage

LocalStorage：代表页面级存储，可以理解为LocalStorage就是内存数据库。可以往里面放数据。

LocalStorage解决的问题：

• 在同一个EntryAlibity中多个页面可以实现数据共享。不同的EntryAlibity无法实现数据共享
• 实现一个页面中定义了存储的数据，在其它子组件中可以共享这个数据

代码的实现：

创建LocalStorage实例：通过构造函数来初始化storage存储的数据

let para :Record<string,string>={
  'username':'小李'
}
let storage:LocalStorage=new LocalStorage(para)

创建LocalStorage实例：通过实例方法来初始化storage存储的数据

let para:LocalStorage=new LocalStorage();
para.setOrCreate('username','wang')

获取数据：

// 从内存中获取页面级别存储，如果获取不到给本地username初始化值
@LocalStorageProp('username') userName:string='默认值1'
@LocalStorageLink('username') myUserName:string='默认值2'

页面共享数据：

export default class EntryAbility extends UIAbility {
  para:Record<string,string]={
    'theme':'Red'
  }
  storage:LocalStorage=new LocalStorage(this.para)
  onWindowStageCreate(windowStage: window.WindowStage): void {
    // Main window is created, set main page for this ability
    hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onWindowStageCreate');

    windowStage.loadContent('pages/Index',this.storage, (err) => {
      if (err.code) {
        hilog.error(0x0000, 'testTag', 'Failed to load the content. Cause: %{public}s', JSON.stringify(err) ?? '');
        return;
      }
      hilog.info(0x0000, 'testTag', 'Succeeded in loading the content.');
    });
  }
}

现给Ability设置一个页面存储对象，这样才能保证这个Ability下面所有得页面可以共享这个storage在页面中

import { PageStorage } from './PageStorage';

let storage=LocalStorage.getShared()

@Entry(storage)
@Component
struct Index {
  @LocalStorageLink('theme') theme:string='默认颜色Index'

  build() {
    Column () {
      Text('字体样式')
        .fontWeight(FontWeight.Bold)
        .textAlign(TextAlign.Center)
        .fontStyle(FontStyle.Italic)
      Text(this.theme)
        .onClick(() =>{
          this.theme='Orange'
        })
      PageStorage()
    }
    .height('100%')
    .width('100%')
  }
}

@Component
export struct PageStorage{
  @LocalStorageProp('theme') theme:string='默认颜色PageStorage'

 build() {
   Column(){
      Text(this.theme)
   }
   .height('100%')
   .width('100%')
 }
}

应用存储Appstorage

应用存储就意味着项目中所有页面都可以实现共享。不需要借助于Ability来实现。

类似于状态机。只要保证状态机有数据，页面就可以直接取出来

初始化AppStorage存储数据

AppStorage.setOrCreate(key,T)

@StorageProp: 和AppStorage中key对应的属性建立单向数据同步

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

[@StorageLink](/user/StorageLink)('key')  storageProp:number=100
[@StorageLink](/user/StorageLink)('key')  storageLink:number=100