小程序组件基础了解
- 不支持标签定义样式,只允许内联样式和class样式
- 不支持ul li 等html标签
- 小程序中是XML写法,不是HTML,所以大多数标签在小程序中无法使用
- 小程序自身支持的标签,是一种组件化的标签.有如下组件可以使用
- 视图容器(View Container)：
| 组件名 | 用途 |
|---|---|
| view | 视图,相当于HTML中div,快级元素 |
| scroll-view | 支持左右,上下滑动模式 |
| swiper | 轮播组件,常用来做广告栏使用 |
| movable-area | 可移动的视图容器，在页面中可以拖拽滑动,1.2新加入的组件 |
- 基础组件
| 组件名 | 用途 |
|---|---|
| navigator | 导航 相当于超链接a |
| icon | 图标组件,微信自定义些简单图标,很少用到 |
| text | 文字组件,有点像html中的span |
| progress | 进度条 |
- 表单组件(基本和HTML类似
| 组件名 | 用途 |
|---|---|
| form | 表单,将组件内的用户输入的switch input checkbox slider radio picker 提交。 |
| button | 按钮,内置一些方法事件绑定 |
| input | 输入框 |
| checkbox | 多项选择器 |
| radio | 单项选择器 |
| picker | 列表选择器,这个组件封装了普通选择器，时间选择器，日期选择器，默认是普通选择器 |
| picker-view | 嵌入页面的滚动选择器,与上面的scroll-view配合使用 |
| slider | 滑动组件,通过滑动改变数值大小,此组件应用场景较灵活 |
| switch | 开关切换标签, 常用来切换页面的2种不同样式效果,数据筛选的排列方式,视图的显示隐藏等 |
| label | 标签.目前可以绑定的控件有：button, checkbox, radio, switch。使用for属性找到对应的id |
- 多媒体类
| 组件名 | 用途 |
|---|---|
| audio | 音频 |
| image | 图片组件,此控件应用频率高 |
| video | 视频控件 |
- 地图控件
| 组件名 | 用途 |
|---|---|
| map | 高级化的组件,用来做地图标记,路线规划等 |
- 画布控件
| 组件名 | 用途 |
|---|---|
| canvas | 画布,常用来绘制数据统计(饼图,柱状图,K线图,雷达图等),游戏开发 |
- 会话控件
| 组件名 | 用途 |
|---|---|
| contact-button | 用于在页面上显示一个客服会话按钮，用户点击该按钮后会进入客服会话。 |
上面组件认识完后,我会在下一专题中写一些常见的布局技巧结合,以及发布一个融合aui样式和antdesign样式的CSS框架,方便在写样式时直接饮用,减少重复时间
