小程序组件基础了解
- 不支持标签定义样式,只允许内联样式和class样式
- 不支持ul li 等html标签
- 小程序中是XML写法,不是HTML,所以大多数标签在小程序中无法使用
- 小程序自身支持的标签,是一种组件化的标签.有如下组件可以使用
| 组件名 |
用途 |
| view |
视图,相当于HTML中div,快级元素 |
| scroll-view |
支持左右,上下滑动模式 |
| swiper |
轮播组件,常用来做广告栏使用 |
| movable-area |
可移动的视图容器，在页面中可以拖拽滑动,1.2新加入的组件 |
| 组件名 |
用途 |
| navigator |
导航 相当于超链接a |
| icon |
图标组件,微信自定义些简单图标,很少用到 |
| text |
文字组件,有点像html中的span |
| progress |
进度条 |
| 组件名 |
用途 |
| 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框架,方便在写样式时直接饮用,减少重复时间
网友评论