# **LocalStorage** 说明:该功能从API version 9开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。 LocalStorage是应用程序中的存储单元,是为应用程序范围内的可变状态属性和非可变状态属性提供存储,可变状态属性和非可变状态属性是构建应用程序UI的特定部分。如一个Ability的UI。 应用层:一个应用程序可以创建多个LocalStorage实例,应用程序的每一个Ability对应一个LocalStorage实例。 Ability:一个Ability中@Entry的所有子代@Component中,最多可以分配一个LocalStorage实例。另外Ability中的所有子组件都将继承对此存储对象的访问权。(一个应用程序可拥有多个Ability) 一个@Component最多可以访问一个LocalStorage实例,一个LocalStorage对象可以分配给多个@Component。 LocalStorage的生命周期跟随其关联的Ability。 ## @LocalStorageLink装饰器 组件通过使用@LocalStorageLink(key)装饰的状态变量(key值为LocalStorage中的属性键值),与LocalStorage建立双向数据绑定,当创建包含@LocalStorageLink的状态变量的组件时,该状态变量的值将会使用LocalStorage中的值进行初始化。(如果LocalStorage中未定义初始值,将使用@LocalStorageLink定义的初始值)。在UI组件中对@LocalStorageLink的状态变量所做的更改将同步到LocalStorage中,并从LocalStorage同步到Ability下的组件中。 ## @LocalStorageProp装饰器 组件通过使用LocalStorageProp(key)装饰的状态变量(key值为LocalStorage中的属性键值),与LocalStorage建立单向数据绑定,当创建包含@LocalStorageProp的状态变量的组件时,该状态变量的值将使用LocalStorage中的值进行初始化。LocalStorage中的属性值的更改会导致当前Ability下的所有UI组件进行状态更新。 注意:LocalStorage定义时没有给定默认值时,那么可以使用组件内@LocalStorageLink和@LocalStorageProp的默认值,如果定义时给定了默认值,那么不会再使用@LocalStorageLink和@LocalStorageProp的默认值。 ## LocalStorage接口: ### Constructor 创建一个新的LocalStorage对象,对对象进行初始化。 | 参数名 | 类型 | 返回值 | 必填 | 描述 | | ------ | ------ | ------ | :--: | ------------------------------------------------------------ | | obj | Object | N/A | 否 | object.keys(obj)返回的所有对象属性及其值都将添加到LocalStorage。 | ### Has | 参数名 | 类型 | 返回值 | 必填 | 描述 | | ------ | ------ | ------- | :--: | ------------------------------ | | key | string | boolean | 是 | 判断对应属性的属性值是否存在。 | ### Get | 参数名 | 类型 | 返回值 | 必填 | 描述 | | ------ | ------ | -------------- | :--: | -------------------- | | key | string | T or undefined | 是 | 获取对应key值的value | ### Set | 参数名 | 类型 | 返回值 | 必填 | 描述 | | -------- | ------ | ------- | :--: | ----------------------------------------------------- | | key | string | boolean | 是 | 如果存在key值,设置value值并返回true。否则返回false。 | | newValue | T | boolean | 是 | 如果存在key值,设置value值并返回true。否则返回false。 | ### SetOrCreate | 参数名 | 类型 | 返回值 | 必填 | 描述 | | -------- | ------ | ------- | :--: | ------------------------------------------------------------ | | key | string | boolean | 是 | 如果已存在与给定键名字相同的属性,更新其值且返回true。 | | newValue | T | boolean | 是 | 如果不存在具有给定名称的属性,在LocalStorage中创建具有给定默认值的新属性,默认值必须是T类型。不允许undefined or null 返回true。 | ### Link | 参数名 | 类型 | 返回值 | 必填 | 描述 | | ------ | ------ | ------ | :--: | ------------------------------------------------------------ | | key | string | T | 是 | 如果存在具有给定键的属性,返回到此属性的双向绑定,该双向绑定意味着变量或者组件对数据的更改将同步到LocalStorage,然后通过LocalStorage实例同步到任何变量或组件。如果不存在给定键的属性,返回undefined。 | ### SetAndLink | 参数名 | 类型 | 返回值 | 必填 | 描述 | | ------------ | ------ | ------ | :--: | ------------------------------------------------------------ | | key | string | @Link | 是 | 与Link接口类似,如果当前的key保存与LocalStorage,返回该key值对应的value值。如果该key值未被创建,则创建一个对应的defaultValue的Link返回。 | | defaultValue | T | @Link | 是 | 与Link接口类似,如果当前的key保存与LocalStorage,返回该key值对应的value值。如果该key值未被创建,则创建一个对应的defaultValue的Link返回。 | 注:Link接口链接:https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/ui/ts-component-states-link.md ### Prop | 参数名 | 类型 | 返回值 | 必填 | 描述 | | ------ | ------ | ------ | :--: | ------------------------------------------------------------ | | key | string | @Prop | 是 | 如果存在具有给定键的属性,返回此属性的单向数据绑定。该单向绑定意味着只能通过LocalStorage将属性的更改同步到变量或组件。该方法返回的变量为不可变变量,适用于可变和不可变的状态变量。如果此键的属性不存在则返回undefined。 | ### SetAndProp | 参数名 | 类型 | 返回值 | 必填 | 描述 | | ------------ | ------ | ------ | :--: | ------------------------------------------------------------ | | key | string | @Prop | 是 | 与Prop接口类似,如果当前的key保存与LocalStorage,返回该key值对应的value值。如果该key值未被创建,则创建一个对应的defaultValue的Prop返回。 | | defaultValue | S | @Prop | 是 | 与Prop接口类似,如果当前的key保存与LocalStorage,返回该key值对应的value值。如果该key值未被创建,则创建一个对应的defaultValue的Prop返回。 | 注:Prop接口链接:https://gitee.com/openharmony/docs/blob/master/zh-cn/application-dev/ui/ts-component-states-prop.md ### Delete | 参数名 | 类型 | 返回值 | 必填 | 描述 | | ------ | ------ | ------- | :--: | ------------------------------------------------------------ | | key | string | boolean | 是 | 删除key指定的键值对,如果存在且删除成功返回true,不存在或删除失败返回false。 | ### Keys | 参数名 | 类型 | 返回值 | 必填 | 描述 | | ------ | ---- | ------------- | :--: | ---------------------------- | | none | none | array | 是 | 返回包含所有键的字符串数组。 | ### Size | 参数名 | 类型 | 返回值 | 必填 | 描述 | | ------ | ---- | ------ | :--: | ---------------------- | | none | none | number | 是 | 与Map.size()用法相同。 | ### Clear | 参数名 | 类型 | 返回值 | 必填 | 描述 | | ------ | ---- | ------- | :--: | ----------------------------------------------------------- | | none | none | boolean | 是 | 删除所有的属性,如果当前有状态变量依旧引用此属性,返回false | ### 示例1(在一个Ability创建的LocalStorage): ```javascript import Ability from '@ohos.appLication.Ability' export default class MainAbility extends Ability { storage : LocalStorage onCreate(want) { this.storage = new LocalStorage(); this.storage.setOrCreate("storageSimpleProp",121); console.log("[Demo MainAbility onCreate]"); globalThis.abilityWant = want; } onDestroy() { console.log("[Demo MainAbility onDestroy]") } onWindowStageCreate(windowStage) { windowStage.setUIContent(this.context,"pages/index",this.storage) } onWindowStageDestroy() { console.log("[Demo] MainAbility onWindoeStageDestroy") } onForeground() { console.log("[Demo] MainAbility onForeground") } onBackground() { console.log("[Demo] MainAbility onBackground") } } ``` @Component组件获取数据: ``` let storage = LocalStorage.GetShared() @Entry(storage) @Component struct LocalStorageComponent { @LocalStorageLink("storageSimpleProp") simpleVarName: number = 0 build() { Column(){ Text(this.simpleVarName.toString()) .onClick(()=>{ this.simpleVarName +=1; }) Text(JSON.stringify(this.simpleVarName)) .fontSize(50) } .height(500) } } ``` ### 示例2(在Entry页面定义LocalStorage): ``` let storage = new LocalStorage({"PropA":47}); @Entry(storage) @Component struct ComA { @LocalStorageLink("PropA") storLink : number = 1; build() { Column() { Text(`Parent from LocalStorage $(this.storLink)`) .onClick(()=>this.storLink+=1) Child() } } } @Component struct Child{ @LocalStorageLink("PropA") storLink : number = 1; build() { Text(`Parent from LocalStorage $(this.storLink)`) .onClick(()=>this.storLink1+=1) } } ```