ui-ts-local_storage.md 12.0 KB
Newer Older
J
jiangbo 已提交
1
# Ability数据存储
J
jiangbo 已提交
2

J
jiangbo 已提交
3
> 说明: 该组件从API version 9开始支持。后续版本如有新增内容,则采用上角标单独标记该内容的起始版本。 
J
jiangbo 已提交
4

J
jiangbo 已提交
5
LocalStorage是应用程序中的存储单元,生命周期跟随其关联的Ability。LocalStorage为应用程序范围内的可变状态属性和非可变状态属性提供存储,可变状态属性和非可变状态属性是构建应用程序UI的一部分,如一个Ability的UI。
J
jiangbo 已提交
6

J
jiangbo 已提交
7
应用层:一个应用程序可以创建多个LocalStorage实例,应用程序的每一个Ability对应一个LocalStorage实例。
J
jiangbo 已提交
8

J
jiangbo 已提交
9
Ability: 一个应用程序可以拥有多个Ability,一个Ability中的所有子组件最多可以分配一个LocalStorage实例。并且,Ability中的所有子组件都将继承对此LocalStorage实例存储对象的访问权。 
J
jiangbo 已提交
10

J
jiangbo 已提交
11
一个组件最多可以访问一个LocalStorage实例,一个LocalStorage对象可以分配给多个组件。
J
jiangbo 已提交
12

J
jiangbo 已提交
13
## @LocalStorageLink装饰器
J
jiangbo 已提交
14

J
jiangbo 已提交
15
组件通过使用@LocalStorageLink(key)装饰的状态变量,key值为LocalStorage中的属性键值,与LocalStorage建立双向数据绑定,当创建包含@LocalStorageLink的状态变量的组件时,该状态变量的值将会使用LocalStorage中的值进行初始化。如果LocalStorage中未定义初始值,将使用@LocalStorageLink定义的初始值。在UI组件中对@LocalStorageLink的状态变量所做的更改将同步到LocalStorage中,并从LocalStorage同步到Ability下的组件中。
J
jiangbo 已提交
16

J
jiangbo 已提交
17
## @LocalStorageProp装饰器
J
jiangbo 已提交
18

J
jiangbo 已提交
19
组件通过使用LocalStorageProp(key)装饰的状态变量,key值为LocalStorage中的属性键值,与LocalStorage建立单向数据绑定,当创建包含@LocalStorageProp的状态变量的组件时,该状态变量的值将使用LocalStorage中的值进行初始化。LocalStorage中的属性值的更改会导致当前Ability下的所有UI组件进行状态更新。
J
jiangbo 已提交
20

J
jiangbo 已提交
21
> 说明:创建LocalStorage实例时没有给LocalStorage实例默认值时,可以使用组件内@LocalStorageLink和>@LocalStorageProp的默认值,如果定义时给定了默认值,那么不会再使用@LocalStorageLink和@LocalStorageProp的默认值。
J
jiangbo 已提交
22

J
jiangbo 已提交
23
## LocalStorage接口
J
jiangbo 已提交
24

J
jiangbo 已提交
25
### constructor  
J
jiangbo 已提交
26

J
jiangbo 已提交
27 28
constructor(initializingProperties?: Object)

J
jiangbo 已提交
29
创建一个新的LocalStorage对象,并进行初始化。
J
jiangbo 已提交
30

J
jiangbo 已提交
31 32 33
| 参数名                 | 类型   | 必填 | 默认值 | 参数描述                                                     |
| ---------------------- | ------ | :--: | ------ | ------------------------------------------------------------ |
| initializingProperties | Object |  否  | -      | object.keys(obj)返回的所有对象属性及其值都将添加到LocalStorage。 |
J
jiangbo 已提交
34 35


J
jiangbo 已提交
36

J
jiangbo 已提交
37
### Has
J
jiangbo 已提交
38

J
jiangbo 已提交
39 40 41 42
has(propName: string): boolean

判断属性值是否存在。

J
jiangbo 已提交
43
**参数:**
J
jiangbo 已提交
44 45 46 47 48

| 参数名   | 类型   | 必填 | 默认值 | 参数描述       |
| -------- | ------ | :--: | ------ | -------------- |
| propName | string |  是  | -      | 属性的属性值。 |

J
jiangbo 已提交
49
**返回值:**
J
jiangbo 已提交
50

J
jiangbo 已提交
51 52 53
| 类型    | 描述                       |
| ------- | -------------------------- |
| boolean | 返回属性的属性值是否存在。 |
J
jiangbo 已提交
54 55


J
jiangbo 已提交
56 57 58

### Get

J
jiangbo 已提交
59 60 61 62
get<T>(propName: string): T

获取对应key值的value。

J
jiangbo 已提交
63
**参数:**
J
jiangbo 已提交
64

J
jiangbo 已提交
65 66 67
| 参数名   | 类型   | 必填 | 默认值 | 参数描述            |
| -------- | ------ | :--: | ------ | ------------------- |
| propName | string |  是  | -      | 要获取对应的key值。 |
J
jiangbo 已提交
68

J
jiangbo 已提交
69
**返回值:**
J
jiangbo 已提交
70

J
jiangbo 已提交
71 72 73
| 类型           | 描述                                            |
| -------------- | ----------------------------------------------- |
| T \| undefined | 当keyvalue存在时,返回值。不存在返回undefined。 |
J
jiangbo 已提交
74

J
jiangbo 已提交
75 76


J
jiangbo 已提交
77 78
### Set

J
jiangbo 已提交
79 80
 set<T>(propName: string, newValue: T): boolean

J
jiangbo 已提交
81
存储对象值。
J
jiangbo 已提交
82

J
jiangbo 已提交
83
**参数:**
J
jiangbo 已提交
84 85 86 87 88 89

| 参数名   | 类型   | 必填 | 默认值 | 参数描述          |
| -------- | ------ | :--: | ------ | ----------------- |
| propName | string |  是  | -      | 要设置的key值。   |
| newValue | T      |  是  | -      | 要设置的value值。 |

J
jiangbo 已提交
90
**返回值:**
J
jiangbo 已提交
91 92 93 94

| 类型    | 描述                                                  |
| ------- | ----------------------------------------------------- |
| boolean | 如果存在key值,设置value值并返回true,否则返回false。 |
J
jiangbo 已提交
95

J
jiangbo 已提交
96 97


J
jiangbo 已提交
98 99
### SetOrCreate

J
jiangbo 已提交
100 101
 setOrCreate<T>(propName: string, newValue: T): boolean

J
jiangbo 已提交
102
创建或更新setOrCreate内部的值。
J
jiangbo 已提交
103

J
jiangbo 已提交
104
**参数:**
J
jiangbo 已提交
105

J
jiangbo 已提交
106 107 108 109
| 参数名   | 类型   | 必填 | 默认值 | 参数描述                |
| -------- | ------ | :--: | ------ | ----------------------- |
| propName | string |  是  | -      | 要更新或者创建的key值。 |
| newValue | T      |  是  | -      | 要更新或创建的value值。 |
J
jiangbo 已提交
110

J
jiangbo 已提交
111
**返回值:**
J
jiangbo 已提交
112 113 114

| 类型    | 描述                                                         |
| ------- | ------------------------------------------------------------ |
J
jiangbo 已提交
115
| boolean | 如果已存在与给定键名字相同的属性,更新其值且返回true。如果不存在具有给定名称的属性,在LocalStorage中创建具有给定默认值的新属性,默认值必须是T类型。不允许undefined 或 null 返回true。 |
J
jiangbo 已提交
116

J
jiangbo 已提交
117 118


J
jiangbo 已提交
119 120
### Link

J
jiangbo 已提交
121
 link<T>(propName: string): T
J
jiangbo 已提交
122 123 124

与localStorage双向数据绑定。

J
jiangbo 已提交
125
**参数:**
J
jiangbo 已提交
126

J
jiangbo 已提交
127 128 129
| 参数名   | 类型   | 必填 | 默认值 | 参数描述               |
| -------- | ------ | :--: | ------ | ---------------------- |
| propName | string |  是  | -      | 要双向绑定的属性名称。 |
J
jiangbo 已提交
130

J
jiangbo 已提交
131
**返回值:**
J
jiangbo 已提交
132 133 134 135

| 类型 | 描述                                                         |
| ---- | ------------------------------------------------------------ |
| T    | 如果存在具有给定键的属性,返回到此属性的双向绑定,该双向绑定意味着变量或者组件对数据的更改将同步到LocalStorage,然后通过LocalStorage实例同步到任何变量或组件。如果不存在给定键的属性,返回undefined。 |
J
jiangbo 已提交
136

J
jiangbo 已提交
137 138


J
jiangbo 已提交
139 140
### SetAndLink

J
jiangbo 已提交
141
 setAndLink<T>(propName: string, defaultValue: T): T
J
jiangbo 已提交
142 143 144

与link接口类似,双向数据绑定localStorage。

J
jiangbo 已提交
145
**参数:**
J
jiangbo 已提交
146

J
jiangbo 已提交
147 148 149 150
| 参数名       | 类型   | 必填 | 默认值 | 参数描述             |
| ------------ | ------ | :--: | ------ | -------------------- |
| propName     | string |  是  | -      | 要进行创建的key值。  |
| defaultValue | T      |  是  | -      | 要进行设置的默认值。 |
J
jiangbo 已提交
151

J
jiangbo 已提交
152
**返回值:**
J
jiangbo 已提交
153

J
jiangbo 已提交
154 155 156
| 类型                                  | 描述                                                         |
| ------------------------------------- | ------------------------------------------------------------ |
| [@Link](ts-component-states-link.md ) | 与Link接口类似,如果当前的key保存于LocalStorage,返回该key值对应的value值。如果该key值未被创建,则创建一个对应的defaultValue的Link返回。 |
J
jiangbo 已提交
157

J
jiangbo 已提交
158 159


J
jiangbo 已提交
160 161
### Prop

J
jiangbo 已提交
162
prop<T>(propName: string): T
J
jiangbo 已提交
163 164 165

单向属性绑定的一种。更新组件的状态。

J
jiangbo 已提交
166
**参数:**
J
jiangbo 已提交
167

J
jiangbo 已提交
168 169 170
| 参数名   | 类型   | 必填 | 默认值 | 参数描述                |
| -------- | ------ | :--: | ------ | ----------------------- |
| propName | string |  是  | -      | 要单向数据绑定的key值。 |
J
jiangbo 已提交
171

J
jiangbo 已提交
172
**返回值:**
J
jiangbo 已提交
173

J
jiangbo 已提交
174 175 176
| 类型                                 | 描述                                                         |
| ------------------------------------ | ------------------------------------------------------------ |
| [@Prop](ts-component-states-prop.md) | 如果存在具有给定键的属性,返回此属性的单向数据绑定。该单向绑定意味着只能通过LocalStorage将属性的更改同步到变量或组件。该方法返回的变量为不可变变量,适用于可变和不可变的状态变量。如果此键的属性不存在则返回undefined。 |
J
jiangbo 已提交
177

J
jiangbo 已提交
178 179


J
jiangbo 已提交
180 181
### SetAndProp

J
jiangbo 已提交
182
setAndProp<T>(propName: string, defaultValue: T): T
J
jiangbo 已提交
183 184 185

与Prop接口类似,存在localStorage的单向数据绑定prop值

J
jiangbo 已提交
186
**参数:**
J
jiangbo 已提交
187

J
jiangbo 已提交
188 189 190 191
| 参数名       | 类型   | 必填 | 默认值 | 参数描述                    |
| ------------ | ------ | :--: | ------ | --------------------------- |
| propName     | string |  是  | -      | 要保存的的键值对中的key值。 |
| defaultValue | S      |  是  | -      | 创建的默认值。              |
J
jiangbo 已提交
192

J
jiangbo 已提交
193
**返回值:**
J
jiangbo 已提交
194

J
jiangbo 已提交
195 196 197
| 类型                                 | 描述                                                         |
| ------------------------------------ | ------------------------------------------------------------ |
| [@Prop](ts-component-states-prop.md) | 如果当前的key保存与LocalStorage,返回该key值对应的value值。如果该key值未被创建,则创建一个对应的defaultValue的Prop返回。 |
J
jiangbo 已提交
198

J
jiangbo 已提交
199 200 201 202


### Delete

J
jiangbo 已提交
203 204 205 206
delete(propName: string): boolean

删除key指定的键值对

J
jiangbo 已提交
207
**参数:**
J
jiangbo 已提交
208 209 210 211 212

| 参数名   | 类型   | 必填 | 默认值 | 参数描述              |
| -------- | ------ | :--: | ------ | --------------------- |
| propName | string |  是  | -      | 要删除的属性的key值。 |

J
jiangbo 已提交
213
**返回值:**
J
jiangbo 已提交
214 215 216 217

| 类型    | 描述                                                         |
| ------- | ------------------------------------------------------------ |
| boolean | 删除key指定的键值对,如果存在且删除成功返回true,不存在或删除失败返回false。 |
J
jiangbo 已提交
218

J
jiangbo 已提交
219 220


J
jiangbo 已提交
221 222
### Keys

J
jiangbo 已提交
223 224 225 226
keys(): IterableIterator<string>

查找所有键

J
jiangbo 已提交
227
**返回值:**
J
jiangbo 已提交
228 229 230 231

| 类型          | 描述                         |
| ------------- | ---------------------------- |
| array<string> | 返回包含所有键的字符串数组。 |
J
jiangbo 已提交
232

J
jiangbo 已提交
233 234


J
jiangbo 已提交
235 236
### Size

J
jiangbo 已提交
237 238 239 240
size(): number

存在的键值对的个数

J
jiangbo 已提交
241
**返回值:**
J
jiangbo 已提交
242

J
jiangbo 已提交
243 244 245
| 类型   | 描述               |
| ------ | ------------------ |
| number | 返回键值对的数量。 |
J
jiangbo 已提交
246

J
jiangbo 已提交
247 248


J
jiangbo 已提交
249 250
### Clear

J
jiangbo 已提交
251 252 253 254
clear(): boolean

删除所有的属性

J
jiangbo 已提交
255
**返回值:**
J
jiangbo 已提交
256

J
jiangbo 已提交
257 258 259
| 类型    | 描述                                                         |
| ------- | ------------------------------------------------------------ |
| boolean | 删除所有的属性,如果当前有状态变量依旧引用此属性,返回false。 |
J
jiangbo 已提交
260

J
jiangbo 已提交
261
### 示例1(在一个Ability创建的LocalStorage)
J
jiangbo 已提交
262

J
jiangbo 已提交
263
```javascript
J
jiangbo 已提交
264 265
import Ability from '@ohos.appLication.Ability'
export default class MainAbility extends Ability {    
J
jiangbo 已提交
266 267 268 269 270 271 272
  storage : LocalStorage    
  onCreate(want) {    
    this.storage = new LocalStorage();
    this.storage.setOrCreate("storageSimpleProp",121);    
    console.log("[Demo MainAbility onCreate]");    
    globalThis.abilityWant = want;   
  }  
J
jiangbo 已提交
273
  onDestroy() {    
J
jiangbo 已提交
274
    console.log("[Demo MainAbility onDestroy]")  
J
jiangbo 已提交
275 276
  }    
  onWindowStageCreate(windowStage) {
J
jiangbo 已提交
277
    windowStage.setUIContent(this.context,"pages/index",this.storage)    
J
jiangbo 已提交
278 279
  }    
  onWindowStageDestroy() {
J
jiangbo 已提交
280
    console.log("[Demo] MainAbility onWindoeStageDestroy")   
J
jiangbo 已提交
281 282
  }    
  onForeground() {
J
jiangbo 已提交
283
    console.log("[Demo] MainAbility onForeground")   
J
jiangbo 已提交
284 285
  }    
  onBackground() {
J
jiangbo 已提交
286
    console.log("[Demo] MainAbility onBackground")    
J
jiangbo 已提交
287 288
  }
}
J
jiangbo 已提交
289 290
```

J
jiangbo 已提交
291
@Component组件获取数据
J
jiangbo 已提交
292 293 294 295 296 297

```
let storage = LocalStorage.GetShared()
@Entry(storage)
@Component
struct LocalStorageComponent {
J
jiangbo 已提交
298 299
  @LocalStorageLink("storageSimpleProp") simpleVarName: number = 0
  build() {
J
jiangbo 已提交
300 301 302
    Column(){
      Text(this.simpleVarName.toString())
        .onClick(()=>{
J
jiangbo 已提交
303
          this.simpleVarName +=1;
J
jiangbo 已提交
304
        })
J
jiangbo 已提交
305 306
      Text(JSON.stringify(this.simpleVarName))
        .fontSize(50)
J
jiangbo 已提交
307 308
    }
    .height(500)
J
jiangbo 已提交
309
  }
J
jiangbo 已提交
310 311 312
}
```

J
jiangbo 已提交
313
### 示例2(在Entry页面定义LocalStorage)
J
jiangbo 已提交
314 315 316 317

```
let storage = new LocalStorage({"PropA":47});
@Entry(storage)
J
jiangbo 已提交
318
@Component 
J
jiangbo 已提交
319 320 321
struct ComA {    
  @LocalStorageLink("PropA") storLink : number = 1;    
  build() {    
J
jiangbo 已提交
322 323
	Column() {        
	  Text(`Parent from LocalStorage $(this.storLink)`)            				                 
J
jiangbo 已提交
324 325 326
        .onClick(()=>this.storLink+=1)            
	    Child()    
 	  }    
J
jiangbo 已提交
327 328
  }
}
J
jiangbo 已提交
329 330 331 332


@Component
struct Child{    
J
jiangbo 已提交
333 334
  @LocalStorageLink("PropA") storLink : number = 1;    
  build() {    
J
jiangbo 已提交
335 336
	Text(`Parent from LocalStorage $(this.storLink)`)        
	  .onClick(()=>this.storLink1+=1)    
J
jiangbo 已提交
337 338
  }
}
J
jiangbo 已提交
339
```