一、组件分类总结

1. 媒体类：Swiper 轮播、Video 视频、Image 图片
2. 文本输入类：Text 静态文字、TextInput 输入框
3. 交互按钮类：Button 按钮、Radio 单选框、Toggle 开关
4. 页面切换类：Tabs 选项卡

二、各组件用途 + 最简示例代码

1. 轮播图 Swiper

作用：首页广告、图片自动滑动切换

2. 视频 Video

作用：本地 / 网络视频播放，配套VideoController控制播放暂停

注意：预览器无法查看视频

3. 图片 Image

作用：展示本地 / 网络图片资源，网络图片（需INTERNET权限）

4. 选项卡 Tabs + TabContent

作用：多页面分类切换（首页 / 我的 / 消息）

5. 文本 Text / 输入框 TextInput

• Text：静态文字展示

TextInput：用户输入、搜索框

6. 按钮 Button

作用：点击交互、触发事件

7. 单选框 Radio + RadioGroup

作用：多选一选择（性别、分类单选）

8. Toggle 开关组件

作用：开关切换（设置页开启 / 关闭功能）

三、通用开发注意点

1. 网络图片 / 网络视频必须在module.json5添加网络权限 ohos.permission.INTERNET；
2. 本地资源：图片放media、视频放rawfile，引用路径不能写错；
3. 所有可交互组件（Button/Toggle/Radio）通过@State修饰变量实现状态刷新；
4. Swiper/Video 自带自动播放、循环、控制器等拓展 API，适合首页多媒体场景。

@State 状态、onClick 点击、onChange 变化、AlertDialog 弹窗、router 页面跳转

• @State：管理输入框、单选框响应式数据，数据修改自动刷新页面；
• onChange：输入框输入、单选框切换时触发，监听数值变化；
• onClick：所有按钮点击触发，用于弹窗、路由跳转；
• 弹窗：
  • AlertDialog：系统极简提示弹窗，无需额外定义组件；
  • @CustomDialog：完全自定义样式弹窗，配合CustomDialogController控制开关；
• 路由 router：pushUrl()跳新页面并传参，back()返回上一页，目标页aboutToAppear生命周期接收参数。