| HTML5 | 微信小程序 |
|---|---|
<h1></h1>...<h6></h6> <p></p> <span></span> | <text></text> |
| <div></div> | <view></view> |
<input type="text"> <input type="checkbox"> <input type="radio"> <input type="file"> | <input /> <checkbox /> <radio /> <view bindtap="chooselmage"> |
| <i class="icon"></i> | <icon></icon> |
<select> <option></option> <option></option> </select> | <picker range="{{area}}"> <view>{{area{index}}}</view> </picker> |
| <a href="#"></a> | <navigator url="#" redirect></navigator> |
| <img src="#"> | <image src="路径"" /> |
下面我就列出常用的标签及其分类。能够帮助之前没有经历过微信小程序前端开发的同学能够快速熟悉。
| 标签 | 说明 |
|---|---|
| view | 视图容器 |
| scroll-view | 可滚动视图容器 |
| swiper | 可滑动的视图容器 |
| 标签名 | 说明 |
|---|---|
| icon | 图标 |
| text | 文字 |
| progress | 进度条 |
| 标签名 | 说明 |
|---|---|
| button | 按钮 |
| form | 表单 |
| input | 输入框 |
| checkbox | 多项选择器 |
| radio | 单项选择器 |
| picker | 列表选择器 |
| slider | 滑动选择器 |
| switch | 开关选择器 |
| label | 标签 |
| 标签名 | 说明 |
|---|---|
| action-sheet | 上拉菜单 |
| modal | 模态弹窗 |
| progress | 进度条 |
| toast | 短通知 |
| loading | 加载 |
| 组件名 | 说明 |
|---|---|
| navigator | 应用内跳转 |
| 标签名 | 说明 |
|---|---|
| audio | 音频 |
| image | 图片 |
| video | 视频 |
| 标签名 | 说明 |
|---|---|
| map | 地图 |
| 标签名 | 说明 |
|---|---|
| canvas | 画布 |
