鸿蒙元应用与卡片使用 @LocalStorageProp 进行通讯的技术分享
发表于 2025-08-25 16:29:23

推广 | 鸿蒙应用开发者激励计划 2025 已发布,上架单个鸿蒙应用最高可获 1 万元现金激励!点击了解

踏入鸿蒙世界的敲门砖,标志着您在技术征途上的全新起点,提升就业竞争力,获得行业认可,点亮职业成长先机,快人一步抢占未来应用开发赛道!https://developer.huawei.com/consumer/cn/training/dev-cert-detail/101666948302721398?ha_source=hmosclass-bokeyuan&ha_sourceId=89000444

在鸿蒙系统(HarmonyOS)的开发中,@LocalStorageProp 是一个非常有用的装饰器,用于在组件之间共享状态或数据。特别是在卡片(Card)和元服务(Meta Service)之间进行通讯时,@LocalStorageProp 可以帮助我们实现数据的持久化和同步。本文将通过一个具体的案例,详细介绍如何使用 @LocalStorageProp 进行通讯。

1、案例背景

假设我们正在开发一个幸运号生成器应用,其中包含一个卡片组件 LotteryNumbersWidgetCard。这个卡片组件需要显示生成的幸运号码,并且这些号码需要在不同的卡片实例之间共享。为了实现这一功能,我们可以使用 @LocalStorageProp 来存储和同步幸运号码。

2、案例代码分析

以下是我们提供的 LotteryNumbersWidgetCard.ets 文件的内容,其中展示了如何使用 @LocalStorageProp 进行通讯。

图片 1.png

图片 2.png

图片 3.png

图片 4.png

3、关键点解析

3.1. 使用 @LocalStorageProp

在上述代码中,@LocalStorageProp 装饰器用于定义需要持久化的属性。这些属性会在组件实例之间共享,并且在应用重启后仍然保留其值。

图片 5.png

・ lotteryType: 定义了幸运号码的类型,默认值为 “5+2”。

・ lotteryNumArr: 定义了生成的幸运号码数组,默认值为 [‘11 12 13 14 15 16’, ‘21’]。

3.2. 数据更新与同步

当用户点击 “生成幸运号码” 按钮时,会调用 GenerateLotteryUtil.generateLottery (this.lotteryType) 方法生成新的幸运号码,并更新 lotteryNumArr 属性。

图片 6.png

由于 lotteryNumArr 使用了 @LocalStorageProp 装饰器,其值会被自动持久化,并在其他卡片实例中同步更新。

3.3. 生命周期方法

在 aboutToDisappear 生命周期方法中,通过 postCardAction 方法将当前的 lotteryType 和 lotteryNumArr 发送到卡片动作中。

图片 7.png

这一步确保了在卡片消失时,当前的状态会被正确地传递出去。

4、实际开发中的注意事项

在实际开发过程中,使用 @LocalStorageProp 进行通讯时需要注意以下几点:

・ 数据类型:确保 @LocalStorageProp 装饰的属性是可序列化的,例如基本数据类型、数组、对象等。

・ 性能考虑:频繁地更新 @LocalStorageProp 属性可能会影响性能,因此应避免不必要的更新。

・ 数据一致性:在多实例共享数据时,确保数据的一致性和同步性,避免数据冲突。

5、总结

通过使用 @LocalStorageProp 装饰器,我们可以轻松地在鸿蒙系统的卡片组件之间共享和同步数据。这不仅简化了数据管理,还提高了应用的响应速度和用户体验。希望本文的技术分享能帮助大家更好地理解和应用 @LocalStorageProp 进行通讯。

(转载自 51CTO,作者:魔眼天王)

CSDN官方微信
扫描二维码,向CSDN吐槽
微信号:CSDNnews
微博关注
【免责声明:CSDN本栏目发布信息,目的在于传播更多信息,丰富网络文化,稿件仅代表作者个人观点,与CSDN无关。其原创性以及文中陈述文字和文字内容未经本网证实,对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本网不做任何保证或者承诺,请读者仅作参考,并请自行核实相关内容。您若对该稿件有任何怀疑或质疑,请立即与CSDN联系,我们将迅速给您回应并做处理。】