@state是arkts中声明组件内响应式状态变量的装饰器,必须初始化,仅通过整体赋值(而非修改子属性)才能触发ui刷新,支持基本类型与引用类型但不监听深层变化。

在HarmonyOS ArkTS开发中,要让UI随数据变化自动刷新,必须用@State声明组件内部的状态变量,普通变量修改后界面不会更新。
声明并初始化@State变量
在@Component结构体中,用@State修饰符声明变量,并【必须在声明时完成初始化】。例如:@State count: number = 0;@State message: string = 'Hello';@State isVisible: boolean = true。
不初始化会编译报错,ArkTS不允许声明未赋值的@State变量。
触发UI更新的正确写法
方法一:基础类型直接赋值
点击按钮时执行 this.count++ 或 this.message = 'World',UI立即重绘。
方法二:数组整体替换
❌ 错误:this.items.push('D') → 不触发更新。
✅ 正确:this.items = [...this.items, 'D'] 或 this.items = [this.items[0], 'D']。
方法三:对象整体替换
❌ 错误:this.userInfo.name = '李四' → UI不动。
✅ 正确:this.userInfo = { ...this.userInfo, name: '李四' }。
【@State对引用类型只监听第一层变化】,嵌套对象深层属性修改必须用展开运算符或Object.assign重建对象。
常见错误排查路径
第一步:确认变量是否被@State装饰,且已初始化。
第二步:检查修改方式——是否为整体赋值而非属性直改。
第三步:验证build函数中是否真正绑定了该变量,比如Text(this.message)而非Text('static text')。
第四步:打开DevEco Studio的Preview预览器,观察实时刷新效果;若仍不更新,检查控制台是否有TS类型错误或运行时警告。











