1. UIAbility内状况-LocalStorage
LocalStorage
是页面级的UI状况存储,经过@Entry
装修器接纳的参数能够在页面内同享同一个LocalStorage
实例。LocalStorage
也能够在UIAbility
内,页面间同享状况。
1)页面内同享
- 创立
LocalStorage
实例:const storage = new LocalStorage({ key: value })
- 单向
@LocalStorageProp('user')
组件内可变 - 双向
@LocalStorageLink('user')
大局均可变
class User {
name?: string
age?: number
}
const storage = new LocalStorage({
user: { name: 'jack', age: 18 }
})
@Entry(storage)
@Component
struct Index {
@LocalStorageProp('user')
user: User = {}
build() {
Column({ space: 15 }){
Text('Index:')
Text(this.user.name + this.user.age)
Divider()
ChildA()
Divider()
ChildB()
}
.width('100%')
.height('100%')
.justifyContent(FlexAlign.Center)
}
}
@Component
struct ChildA {
@LocalStorageProp('user')
user: User = {}
build() {
Column({ space: 15 }){
Text('ChildA:')
Text(this.user.name + this.user.age)
.onClick(()=>{
this.user.age ++
})
}
}
}
@Component
struct ChildB {
@LocalStorageLink('user')
user: User = {}
build() {
Column({ space: 15 }){
Text('ChildB:')
Text(this.user.name + this.user.age)
.onClick(()=>{
this.user.age ++
})
}
}
}
2)页面间同享
- 在
UIAbility
创立LocalStorage
经过loadContent
供给给加载的窗口
在页面运用 const storage = LocalStorage.GetShared()
得到实例,经过 @Entry(storage)
传入页面
entryAbility/EntryAbility.ts
+ storage = new LocalStorage({
+ user: { name: 'jack', age: 18 }
+ })
onWindowStageCreate(windowStage: window.WindowStage) {
// 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, data) => {
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. Data: %{public}s', JSON.stringify(data) ?? '');
});
}
models/index.ets
export class User {
name?: string
age?: number
}
pages/Index.ets
import { User } from '../models'
const storage = LocalStorage.GetShared()
@Entry(storage)
@Component
struct Index {
@LocalStorageProp('user')
user: User = {}
build() {
Column({ space: 15 }) {
Text('Index:')
Text(this.user.name + this.user.age)
.onClick(()=>{
this.user.age ++
})
Navigator({ target: 'pages/OtherPage' }){
Text('Go Other Page')
}
}
.width('100%')
.height('100%')
.justifyContent(FlexAlign.Center)
}
}
pages/OtherPage.ets
import { User } from '../models'
const storage = LocalStorage.GetShared()
@Entry(storage)
@Component
struct OtherPage {
@LocalStorageLink('user')
user: User = {}
build() {
Column({ space: 15 }) {
Text('OtherPage:')
Text(this.user.name + this.user.age)
.onClick(()=>{
this.user.age ++
})
}
.width('100%')
.height('100%')
.justifyContent(FlexAlign.Center)
}
}
注意
- 页面间同享需求要模拟器测验
- 运用逻辑中运用参阅 链接
2. 运用状况-AppStorage
AppStorage
是运用大局的UI状况存储,是和运用的进程绑定的,由UI框架在运用程序启动时创立,为运用程序UI状况特点供给中央存储。
假如是初始化运用 AppStorage.SetOrCreate(key,value)
单向 @StorageProp('user')
组件内可变
双向 @StorageLink('user')
大局均可变
1)经过UI装修器运用
import { User } from '../models'
AppStorage.SetOrCreate<User>('user', { name: 'jack', age: 18 })
@Entry
@Component
struct Index {
@StorageProp('user')
// 可忽略,编辑器类型错误
user: User = {}
build() {
Column({ space: 15 }) {
Text('Index:')
Text(this.user.name + this.user.age)
.onClick(() => {
this.user.age++
})
Divider()
ChildA()
}
.width('100%')
.height('100%')
.justifyContent(FlexAlign.Center)
}
}
@Component
struct ChildA {
@StorageLink('user')
user: User = {}
build() {
Column({ space: 15 }){
Text('ChildA:')
Text(this.user.name + this.user.age)
.onClick(()=>{
this.user.age ++
})
}
}
}
2)经过逻辑运用
-
AppStorage.Get<ValueType>(key)
获取数据 -
AppStorage.Set<ValueType>(key,value)
掩盖数据 -
const link: SubscribedAbstractProperty<ValueType> = AppStorage.Link(key)
掩盖数据-
link.set(value)
修正 -
link.get()
获取
-
import promptAction from '@ohos.promptAction'
import { User } from '../models'
AppStorage.SetOrCreate<User>('user', { name: 'jack', age: 18 })
@Entry
@Component
struct Index {
@StorageLink('user')
user: User = {}
build() {
Column({ space: 15 }) {
Text('Index:')
Text(this.user.name + this.user.age)
.onClick(() => {
this.user.age++
})
Divider()
Text('Get()')
.onClick(() => {
// 仅获取
const user = AppStorage.Get<User>('user')
promptAction.showToast({
message: JSON.stringify(user)
})
})
Text('Set()')
.onClick(() => {
// 直接设置
AppStorage.Set<User>('user', {
name: 'tom',
age: 100
})
// 观察页面更新没
})
Text('Link()')
.onClick(() => {
// 获取user的prop
const user: SubscribedAbstractProperty<User> = AppStorage.Link('user')
user.set({
name: user.get().name,
// 获取后修正
age: user.get().age + 1
})
})
}
.width('100%')
.height('100%')
.justifyContent(FlexAlign.Center)
}
}
3. 状况耐久化-PersistentStorage
PersistentStorage 将选定的 AppStorage 特点保留在设备磁盘上。
DETAILS
UI和业务逻辑不直接拜访PersistentStorage
中的特点,一切特点拜访都是对AppStorage
的拜访,AppStorage
中的更改会自动同步到PersistentStorage
。
WARNING
- 支撑:
number
,string
,boolean
,enum
等简略类型; - 假如:要支撑对象类型,能够转换成json字符串
- 耐久化变量最好是小于
2kb
的数据,假如开发者需求存储很多的数据,主张运用数据库api。
1)简略数据类型的耐久化,和获取和修正
import { User } from '../models'
PersistentStorage.PersistProp('count', 100)
@Entry
@Component
struct Index {
@StorageLink('count')
count: number = 0
build() {
Column({ space: 15 }) {
Text(this.count.toString())
.onClick(() => {
this.count++
})
}
.width('100%')
.height('100%')
.justifyContent(FlexAlign.Center)
}
}
2)复杂数据类型的耐久化,和获取和修正
import promptAction from '@ohos.promptAction'
import { User } from '../models'
PersistentStorage.PersistProp('userJson', `{ "name": "jack", "age": 18 }`)
@Entry
@Component
struct Index {
@StorageProp('userJson')
@Watch('onUpdateUser')
userJson: string = '{}'
@State
user: User = JSON.parse(this.userJson)
onUpdateUser() {
this.user = JSON.parse(this.userJson)
}
build() {
Column({ space: 15 }) {
Text('Index:')
Text(this.user.name + this.user.age)
.onClick(() => {
this.user.age++
// 修正
AppStorage.Set('userJson', JSON.stringify(this.user))
})
Divider()
Text('Get()')
.onClick(() => {
// 获取
const user = AppStorage.Get<string>('userJson')
promptAction.showToast({ message: user })
})
}
.width('100%')
.height('100%')
.justifyContent(FlexAlign.Center)
}
}
4. 设备环境-Environment
开发者假如需求运用程序运行的设备的环境参数,以此来作出不同的场景判断,比方多语言,暗黑模式等,需求用到
Environment
设备环境查询。
Environment
的一切特点都是不行变的(即运用不行写入),一切的特点都是简略类型。
关注公众号:Android老皮!!!欢迎大家来找我讨论交流