一、前言
前面我们学完了 @State、@Prop、@Link、Provide/Consume，这些全部都是组件级临时状态。
但在真实商用项目中，大量数据需要跨页面共享、页面销毁不丢失、应用全局响应、重启保留，比如：登录态、用户信息、主题模式、字体大小、全局配置、设备参数等。
很多开发者到这里会出现状态架构崩盘的典型问题：
全部用全局变量裸写，页面互相篡改，数据溯源困难；
分不清 LocalStorage 和 AppStorage，乱用导致状态不更新、不持久化；
页面销毁重建，状态丢失、界面闪白、数据重置；
全局状态、页面状态、组件状态混在一起，页面无限重复渲染；
状态无分层，小数据、大数据、临时数据、持久数据一锅乱炖。
本篇彻底打通鸿蒙完整状态分层体系：组件状态 → 页面状态 → 全局内存状态 → 全局持久化状态，教会你企业级状态分层架构，从此项目状态零混乱、渲染高性能、数据高稳定。
二、鸿蒙完整四层状态体系（核心架构）
鸿蒙 ArkTS 所有状态，严格分为四层，层级绝对不能乱：
状态层级 | 对应装饰器 | 作用域 | 是否持久化 | 核心用途 |
|---|
组件私有状态 | @State | 当前组件 | 否 | 按钮显隐、输入框、开关、局部UI |
页面级共享状态 | @LocalStorage | 当前页面所有组件 | 可配置 | 单页面多组件共享，页面销毁释放 |
应用全局内存状态 | 全局单例类 | 全应用所有页面 | 否 | 全局弹窗、加载态、临时全局配置 |
应用全局持久化状态 | @AppStorage | 全应用全局 | 是 | 登录态、主题、用户配置、系统偏好 |
架构金句：临时数据走局部，全局数据走仓库，配置数据走持久化。
三、AppStorage 全局持久化状态（应用级）
@AppStorage 是鸿蒙官方顶层全局状态，跨所有页面共享、应用重启不丢失，底层基于 Preferences 持久化，无需手动读写缓存。
适合：登录状态、暗黑模式、字体大小、语言设置、常驻用户信息。
3.1 基础用法（全局响应式+自动持久化）
@Entry@Componentstruct AppStoragePage { // 全局持久化状态，全局唯一，所有页面共用 @AppStorage("isLogin") isLogin: boolean = false @AppStorage("userName") userName: string = "游客" @AppStorage("darkMode") darkMode: boolean = false build() { Column({ space: 20 }) { Text(`登录状态：${this.isLogin ? "已登录" : "未登录"}`) Text(`当前用户：${this.userName}`) Text(`暗黑模式：${this.darkMode ? "开启" : "关闭"}`) Button("模拟登录") .onClick(() => { // 全局修改，所有页面同步刷新 this.isLogin = true this.userName = "鸿蒙全栈开发者" }) Button("切换暗黑模式") .onClick(() => { this.darkMode = !this.darkMode }) } .width('100%') .height('100%') .justifyContent(FlexAlign.Center) }}
3.2 AppStorage 核心特性
3.3 禁止使用场景（高频坑点）
不适合存储频繁变化的临时数据（会频繁写磁盘、损耗性能）；
不适合存储大数组、列表数据（底层是键值对，大数据卡顿）；
不适合页面临时UI状态（全局常驻，页面销毁不释放）。
四、LocalStorage 页面级状态（页面私有全局）
很多开发者分不清 LocalStorage 和 AppStorage：
AppStorage = 整个App全局
LocalStorage = 当前页面全局
LocalStorage 作用于当前页面内所有父子组件，页面关闭自动销毁，不会污染全局状态，完美解决单页面多组件传值冗余问题。
4.1 页面初始化 LocalStorage
// 页面入口初始化局部全局仓库let pageLocalStorage: LocalStorage = new LocalStorage()// 初始化默认值pageLocalStorage.setOrCreate("pageTitle", "默认页面标题")pageLocalStorage.setOrCreate("pageLoading", false)@Entry(storage: pageLocalStorage)@Componentstruct LocalStoragePage { // 绑定页面级全局状态 @LocalStorage pageTitle: string @LocalStorage pageLoading: boolean build() { Column({ space: 15 }) { Text(this.pageTitle).fontSize(22) if (this.pageLoading) { LoadingProgress().width(50) } Button("修改页面全局状态") .onClick(() => { this.pageTitle = "页面全局状态已更新" this.pageLoading = true }) // 子组件直接读取页面全局状态，无需传参 PageChildItem() } .width('100%') .height('100%') .justifyContent(FlexAlign.Center) }}// 子组件：无需任何传参，直接使用页面全局状态@Componentstruct PageChildItem { @LocalStorage pageTitle: string @LocalStorage pageLoading: boolean build() { Column() { Text(`子组件读取标题：${this.pageTitle}`) Text(`加载状态：${this.pageLoading ? "加载中" : "加载完成"}`) } }}
4.2 LocalStorage 核心优势
五、LocalStorage VS AppStorage 终极区别（面试+实战必背）
对比项 | AppStorage | LocalStorage |
|---|
作用范围 | 全局所有页面 | 仅当前页面 |
生命周期 | 应用运行常驻，重启保留 | 页面创建而生，页面销毁而亡 |
持久化能力 | 默认自动持久化 | 默认不持久化，可手动配置 |
数据污染 | 全局共享，易滥用 | 页面隔离，绝对无污染 |
适用场景 | 用户、主题、配置、登录态 | 页面共享UI、页面加载态、页面临时数据 |
六、商用全局状态架构（单例内存状态）
除了官方两种全局状态，商用项目必须搭配全局单例内存仓库，用于存放：频繁变更、无需持久化、全局通用的临时状态。
例如：全局 Loading、全局弹窗、网络状态、全局消息计数。
6.1 全局状态仓库封装
// store/GlobalState.etsexport default class GlobalState { // 单例 private static instance: GlobalState public static getInstance(): GlobalState { if (!this.instance) { this.instance = new GlobalState() } return this.instance } // 全局加载态 globalLoading: boolean = false // 全局未读消息数 unReadCount: number = 0 // 全局网络状态 isNetworkOk: boolean = true // 修改方法统一封装，规范数据流 setLoading(status: boolean) { this.globalLoading = status } setUnReadCount(num: number) { this.unReadCount = num }}
6.2 页面全局使用
import GlobalState from '../store/GlobalState'@Entry@Componentstruct GlobalStorePage { store = GlobalState.getInstance() build() { Column({ space: 20 }) { Text(`全局未读消息：${this.store.unReadCount}`) Text(`网络状态：${this.store.isNetworkOk ? "正常" : "异常"}`) Button("开启全局加载") .onClick(() => { this.store.setLoading(true) }) } .width('100%') .height('100%') .justifyContent(FlexAlign.Center) }}
七、企业级状态分层落地规范（强制标准）
所有商用项目严格遵守以下分层规则，彻底杜绝状态混乱：
7.1 @State 组件私有状态
仅存放：按钮禁用、输入框文本、组件显隐、局部UI
禁止：页面共享、全局共享数据
7.2 @LocalStorage 页面级状态
仅存放：当前页面多组件共享数据、页面加载态、页面临时配置
禁止：跨页面数据、长期常驻数据
7.3 全局单例Store
仅存放：全局临时状态、频繁变更状态、全局UI状态
禁止：大量数据、需要持久化的数据
7.4 @AppStorage 全局持久化状态
仅存放：用户常驻信息、主题、语言、系统配置、开关偏好
禁止：临时UI、频繁刷新、大数据列表
八、高频踩坑汇总（90%开发者都错）
乱用AppStorage存临时数据：频繁读写磁盘，造成性能卡顿、耗电增加；
页面共享数据用逐层传参：代码臃肿、维护困难、数据不同步；
全局状态不封装方法：页面直接篡改属性，无法溯源、无法统一拦截；
LocalStorage全局定义：多页面共用实例，状态互相污染；
混淆持久化与内存状态：该常驻的丢失、该临时的一直残留；
所有状态全部用@State：组件复用、页面重建数据全部错乱。
九、全文总结
鸿蒙状态管理的最高境界不是会用装饰器，而是会分层。
@State 管组件、LocalStorage 管页面、全局Store 管临时全局、AppStorage 管永久全局配置。
严格遵循四层状态架构，你的项目状态将会：数据统一、渲染精准、无泄漏、无污染、易维护，完全达到企业商用标准。
