微信小程序组件对照表常用组件标签与用途说明
基础内容与视图组件
| 组件 | 用途 / 说明 |
|---|---|
| view | 视图容器，类似 HTML 的 div，用于页面布局与区块划分 |
| text | 文本展示组件，支持富文本与行内文本，性能优于 textarea |
| image | 图片展示组件，支持懒加载、裁剪与占位图，绑定 mode 控制显示方式 |
| button | 按钮组件，支持点击跳转、开放能力（分享、获取用户信息）等 |
| icon | 内置图标组件，提供成功、信息、警告、取消等常用图标 |
| progress | 进度条组件，展示加载或上传下载进度 |
| rich-text | 富文本组件，可渲染 HTML 或节点文本结构 |
表单与输入组件
| 组件 | 用途 / 说明 |
|---|---|
| input | 单行文本输入框，用于账号、搜索等短文本输入 |
| textarea | 多行文本输入区域，用于留言、评论等长文本输入 |
| form | 表单容器，统一收集并提交表单控件的值 |
| checkbox / radio | 多选框 / 单选框，用于多种或单一选项选择 |
| switch | 开关切换器，用于布尔值的开启与关闭设置 |
| slider | 滑动选择器，通过拖动选择区间内的数值 |
| picker | 滚动选择器，支持普通、日期、时间、地区等模式 |
导航与媒体组件
| 组件 | 用途 / 说明 |
|---|---|
| scroll-view | 可滚动视图区域，支持横纵向滚动与下拉刷新 |
| swiper | 滑块视图容器，常用于轮播图与横向翻页 |
| swiper-item | swiper 的子项，表示轮播的每一屏内容 |
| navigator | 页面跳转组件，可跳转内部页面或打开外部 URL |
| video | 视频播放组件，支持直播与本地视频播放 |
| audio / music | 音频播放组件，用于背景音乐与语音播放 |
| map | 地图组件，用于展示地图、标记点与路线 |
| canvas | 画布组件，用于绘制图形、图表与海报生成 |
微信小程序组件对照表介绍
微信小程序提供了一套与 HTML 标签类似的组件体系，通过 view、text、button 等组件即可搭建完整的页面界面，无需额外引入 UI 框架。
▪ 布局与内容组件是页面构建的基础，view 负责分区，text 与 image 负责内容展示，组合即可实现绝大多数静态界面。
▪ 表单组件与 bindtap、bindinput 等事件绑定结合，可轻松实现用户输入、提交与状态交互，配合 setData 完成界面更新。
▪ swiper、scroll-view、navigator 等组件赋予页面滚动、轮播与跳转能力，合理组合可构建具有流畅交互体验的商业应用。