@State 状态装饰器：页面动态刷新的核心

@State是 ArkTS 最基础的状态管理装饰器，作用是定义响应式变量。被该装饰器修饰的数据发生改变时，绑定该变量的 UI 组件会自动刷新视图，实现数据驱动界面更新。 我们日常的文字修改、单选框选中、开关切换，底层全部依靠@State完成。普通普通变量修改不会触发页面重绘，而@State变量可以完成 UI 实时同步，是动态交互的底层基石。

ets

@State msg:string = "初始文字"

弹窗（AlertDialog）：轻量提示交互

弹窗是全局浮层组件，悬浮于页面上层，常用于消息提示、确认操作、警告提醒。鸿蒙内置AlertDialog原生弹窗，可自定义标题、提示文本、确认 / 取消双按钮。 典型场景：提交前二次确认、删除警告、操作成功提示。无需新建页面，轻量高效，不破坏当前页面上下文，是表单操作必备的反馈组件。

页面路由 router：实现多页面跳转

单页面只能完成简单展示，完整 App 必然包含多个页面，路由 Router就是负责页面之间跳转、页面传值、页面返回的核心机制。 配合router_map.json路由配置文件，我们可以实现：从首页跳转到详情页、编辑页，同时携带参数；也可以回退上一页。分为命名路由与页面栈管理，可以精准控制页面栈生命周期，是多页面应用的必备技术。

事件

1. onClick 点击事件

触发时机：组件被鼠标 / 手指点击时执行，多用于 Button 按钮、图片等可点击控件。 核心用途：绑定点击业务逻辑，例如按钮提交、页面跳转、文字重置、打开弹窗等，是页面最常用的交互事件。

Button("按钮")
  .onClick(()=>{
    // 点击后执行代码
  })

2. onChange 数值变更事件

触发时机：组件内部数值、选中状态、输入内容发生改变时自动执行，不会受点击动作触发。 适用控件：TextInput 输入框、Radio 单选框、Toggle 开关、Swiper 轮播等。输入文字、切换单选选项、拨动开关时，实时捕获最新值，实时校验内容、记录选中状态。

TextInput()
  .onChange((value:string)=>{
    // 实时获取输入的内容
  })

二者核心区别：onClick是人为点击动作触发，onChange是组件内部数据变化触发。

总结

1. @State是数据与视图联动的根基，实现动态 UI；
2. onClick处理点击行为，onChange监听数据变化，覆盖绝大多数交互场景；
3. 弹窗用于即时消息反馈，路由负责多页面页面跳转。 以上知识点串联起来，就可以结合之前的基础组件，开发出具备完整交互逻辑、多页面结构的鸿蒙应用，完成从静态页面到动态业务项目的进阶。