【鸿蒙实战开发】记录下LocalStorage、AppStorage、PersistentStorage的持久化存储相关_localstorage.setitem 鸿蒙包错

作者：知新_RL | 2024-07-27 02:41:21

踩

localstorage.setitem 鸿蒙包错

前言

记录下最近适配鸿蒙用到状态存储的一些理解。

理解

虽然官方文档中将管理应用存储分为了LocalStorage（页面级）、AppStorage（应用级）、PersistentStorage（持久化存储）三种类型。
使用下来，感觉其实只要关注LocalStorage（页面级）、AppStorage（应用级）两种类型就好了，而PersistentStorage与其说是存储管理，不如说是存储标记，具体的看下问吧。

LocalStorage页面级存储

在鸿蒙中LocalStorage从概念和理解是都完全不同于 Web的 localStorage。他相当于设置了一个只作用于某个页面的存储区。
别看官方文档写了一大堆，实际上用法无外乎以下：

●声明：new LocalStorage(object) ,创建一个LocalStorage，可以设置初始内容。
●绑定到页面：在页面的组件上使用 @Entry(storage)进行绑定。绑定后，该页面组件、以及子组件都可使用该存储中的数据了。
●使用：

○@LocalStorageProps:单向绑定，也就是页面改变了值的内容，不会影响到 localStore 中存储数据
○@LocalStorageLink:双向绑定，也就是页面改变了值的内容，会一并影响到 localStore 中存储数据
○PS：值得一提的是，鸿蒙中@Props 都是单向绑定，@Link 都是双向绑定。

  //初始化
 let para: Record<string, number> = { 'PropA': 47 };
 let storage: LocalStorage = new LocalStorage(para);
 
 //添加创建值
 storage.setOrCreate('PropB', new PropB(50));

 //绑定
 @Entry(storage)
 @Component
struct CompA {

   //使用
   @LocalStorageProps('PropA') childLinkNumber: number = 1;
   @LocalStorageLink('PropB') childPropsNumber: number = 1;
        
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

AppStorage页面级存储

AppStorage和LocalStorage的区别，主要凸显在两个地方。

1.AppStorage是作用于全局的，整个应用周期，无需声明，也无需进行@Entry(storage)绑定
2.AppStorage配合PersistentStorage可以实现持久化存储（下面细讲）。

//直接设置值
AppStorage.setOrCreate('PropA', 47);
AppStorage.setOrCreate('PropB', new PropB(50));

struct CompA {

   //然后使用
   @StorageProps('PropA') childLinkNumber: number = 1;
   @StorageLink('PropB') childPropsNumber: number = 1;
        
}
1
2
3
4
5
6
7
8
9
10
11

PersistentStorage持久化存储

PersistentStorage虽然名字和AppStorage、LocalStorage很像，但实际上他不负责存储相关的操作。它的作用其实是声明、或者标记。
通过persistProp声明一个键值对，然后AppStorage存储的该数据就变成了持久化存储了。这句话有几个注意点。

1.因为是声明：所以声明一次就好了，建议在 app 启动后就声明。
2.因为是AppStorage中该数据变成持久化存储，所以针对该数据的操作都通过AppStorage来进行操作。重点啊！敲黑板
3.声明一定要在 AppStorage使用之前！重点，这是个坑。

   //声明了属性aProp，并设置默认值。（该默认值，是未存储过的时候才使用的默认值）
    PersistentStorage.persistProp('aProp', 47);
    // 获取持久化值
    AppStorage.get('aProp')
    // 使用
    AppStorage.setOrCreate('aProp'，36）
1
2
3
4
5
6

错误示范，如果声明在AppStorage使用之后，那会造成你获取的将不是持久化存储的值。

    // 使用
    AppStorage.setOrCreate('aProp'，36）
     //声明了属性aProp，并设置默认值。（该默认值，是未存储过的时候才使用的默认值）
    PersistentStorage.persistProp('aProp', 47);
    // 获取持久化值
    AppStorage.get('aProp')
1
2
3
4
5
6

错误示范二:
const class 在初始化时使用 AppStorage.setOrCreate，但是在 EntryAbility.onCreate中声明。
如果你以为EntryAbility.onCreate是先执行的那就错了。例如以下创建 class，该 account 的constructor，就会在EntryAbility.onCreate 之前调用。这个顺序非常重要.

export const account = new Account();
1

既然PersistentStorage既然是标记一个AppStorage的一个值是否持久化，那如何取消持久化呢？

//取消持久化标记
PersistentStorage.deleteProp('key')
1
2

存储的数据如何查看？？？？

1.studio -> Device File Browser
2.找到应用的persistent_storage存储文件，路径中 el2，和 el1 应该是引擎版本：/data/app/el2/100/base/[包名]/haps/entry/files/persistent_storage
3.玩 android 的有没有眼前一亮哈哈哈哈，这不就是sharepreference嘛。
在这里插入图片描述

写在最后

有很多小伙伴不知道学习哪些鸿蒙开发技术？不知道需要重点掌握哪些鸿蒙应用开发知识点？而且学习时频繁踩坑，最终浪费大量时间。所以有一份实用的鸿蒙（HarmonyOS NEXT）资料用来跟着学习是非常有必要的。

这份鸿蒙（HarmonyOS NEXT）资料包含了鸿蒙开发必掌握的核心知识要点，内容包含了（ArkTS、ArkUI开发组件、Stage模型、多端部署、分布式应用开发、音频、视频、WebGL、OpenHarmony多媒体技术、Napi组件、OpenHarmony内核、Harmony南向开发、鸿蒙项目实战等等）鸿蒙（HarmonyOS NEXT）技术知识点。