本篇内容 ArkTS的应用级变量的状态管理学习
一、知识储备
1. LocalStorage
- LocalStorage是为页面级别的状态变量提供存储的内存内“数据库”
- 一个HAP可以有多个LocalStorage,其实例可以在页面内共享,也可以通过GetShared接口,实现跨页面、UIAbility实例内共享。
- 组件树的根节点,即被@Entry装饰的@Component,可以被分配一个LocalStorage实例,其所有子组件实例将自动获得对该LocalStorage实例的访问权限
- 没有被@Entry装饰的@Component只能访问父组件的LocalStorage实例。
- LocalStorage内所有属性都是可变的。
- @LocalStorageProp 给定属性建立单向同步关系
- @LocalStorageLink 给定属性建立双向同步关系
- LocalStorage内命名属性,不可中途变更类型。
2. AppStorage
- 应用级别的状态变量存储的数据库,支持基本数据类型
- 用法与LocalStorage相似,AppStorage的函数全部为静态函数,可以直接调用
- @StorageProp 给定属性建立单向同步关系
- @StorageLink 给定属性建立双向同步关系
3. PersistentStorage
- 持久化存储状态变量方案,支持基本数据类型
- 常用 接口,PersistProp,DeleteProp,PersistProps(批量持久化接口)
4. Environment
- 设备本身数据查询,比如语言、模式、等
- 常用接口EnvProp,EnvProps(批量)
- 常见属性
key | 值类型 | 说明 |
---|
accessibilityEnabled | boolean | 获取无障碍屏幕读取是否启用。 |
colorMode | ColorMode | 色彩模型类型:选项为ColorMode.LIGHT: 浅色,ColorMode.DARK: 深色。 |
fontScale | number | 字体大小比例,范围: [0.85, 1.45]。 |
fontWeightScale | number | 字体粗细程度,范围: [0.6, 1.6]。 |
layoutDirection | LayoutDirection | 布局方向类型,LayoutDirection.LTR: 从左到右,LayoutDirection.RTL: 从右到左。 |
languageCode | stringstring | 当前系统语言,例如zh |
效果一览
源码分析讲解
import App from '@system.app';
@Entry
@Component
struct AppPage {
@LocalStorageProp("age") age: number = 10; //单向同步
@LocalStorageLink("name") name: string = '小明'; //双向同步
@StorageLink('weight') weight: number = 110;
@State person: Person2 = new Person2(11, '小红')
@StorageLink('lastTime') lastTime: string = AppStorage.Get('lastTime');
@StorageProp('languageCode') languageCode: string = AppStorage.Prop('languageCode')
build() {
Row() {
Column() {
Child({ person: new Person2(this.age, this.name) }) //改变localStorage实例内同修属性
.width('100%')
.onClick(() => {
this.age = 11
this.name = '小红'
})
Son({ person: new Person2(19, '没有名') })
Text(`数据源:name: ${storage.get('name')}\n数据源:age: ${storage.get('age')}\n数据源:sex: ${storage.get('sex')}\n数据源:height: ${storage.get('height')}\n数据源:weight: ${storage.get('weight')}`) //localStorage实例内属性傎的变化记录
.fontSize(33)
.fontWeight(FontWeight.Bold)
.backgroundColor(Color.Green)
Button() { //改变localStorage实例内同修属性
Text('改变数据源name为小王,age为18')
}
.type(ButtonType.Capsule)
.onClick(() => {
this.age = 18
this.name = "小王"
})
Text(this.lastTime)
.onClick(() => {
this.lastTime = '上次登录时间:' + new Date().toTimeString()
})
Text(`当前系统语言是:${this.languageCode}`)
}
}
}
}
@Component
struct Child { //普通的子组件
@ObjectLink person: Person2
@LocalStorageLink("sex") sex: string = '女的' //兄弟组件之间双向同步
build() {
Text(`${this.person.name}今年${this.person.age}岁了,是个${this.sex}`)
.fontSize(55)
.fontWeight(FontWeight.Bold)
}
}
@Component
struct Son { //普通的子组件
@ObjectLink person: Person2
@LocalStorageLink("sex") sex: string = '女的' //兄弟组件之间双向同步
build() {
Text(`${this.person.name}今年${this.person.age}岁了,是个${this.sex}`)
.fontSize(55)
.fontWeight(FontWeight.Bold)
.onClick(() => {
this.sex = '男的' //兄弟组件之间双向同步
})
}
}
@Observed
class Person2 {
public age: number
public name: string
constructor(age: number, name: string) {
this.age = age;
this.name = name;
}
}
// let storage = new LocalStorage({ 'age': 10, 'name': '小明' }) // 创建localStorage实例
let storage = LocalStorage.GetShared() //获取传递过来的localStorage实例
AppStorage.SetOrCreate('weight', 100) //全局缓存实例
PersistentStorage.PersistProp('lastTime', new Date().toTimeString()) //数据磁盘持久化
Environment.EnvProp('languageCode', 'en') //设备数据信息读取
import UIAbility from '@ohos.app.ability.UIAbility';
import hilog from '@ohos.hilog';
import window from '@ohos.window';
export default class EntryAbility extends UIAbility {
onCreate(want, launchParam) {
hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onCreate');
}
onDestroy() {
hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onDestroy');
}
/*****************在这里定义LocalStorage*****************/
args: Record<string, Object> = {
'height': 111, 'age': 10, 'name': '小明', sex: '未知'
};
storage: LocalStorage = new LocalStorage(this.args)
onWindowStageCreate(windowStage: window.WindowStage) {
windowStage.loadContent('pages/AppPage', this.storage) //把localStorage实例传递过去
}
/*****************在这里定义LocalStorage*****************/
onWindowStageDestroy() {
// Main window is destroyed, release UI related resources
hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onWindowStageDestroy');
}
onForeground() {
// Ability has brought to foreground
hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onForeground');
}
onBackground() {
// Ability has back to background
hilog.info(0x0000, 'testTag', '%{public}s', 'Ability onBackground');
}
}