小程序组件

视图容器view

view是静态的视图容器，通常用和首尾标签来表示一个容器区域。需要注意的是，view容器本身没有大小和颜色，需由开发者自行进行样式设置。

图标组件icon

开发者可以自定义其类型、大小和颜色。

文本组件text

进度条组件progress

表单组件

按钮button

<button size='default'>普通按钮</button>
<button size='mini'>迷你按钮</button>

<button type='primary'>primary按钮</button>
<button type='default'>default按钮</button>
<button type='warn'>warn按钮</button>

<button form-type='submit'>提交按钮</button>
<button form-type='reset'>重置按钮</button>

多选框checkbox

<checkbox-group>
  <checkbox value='apple' checked />苹果
  <checkbox value='banana' disabled />香蕉
  <checkbox value='grape' />葡萄
  <checkbox value='lemon' />柠檬
</checkbox-group>

输入框input

<input type='text' /> <!--文本输入-->
<input type='number' /> <!--数字输入-->
<input type='idcard ' /> <!--身份证输入-->
<input type='digit' /> <!--带小数点的数字-->
<input confirm-type='send' /> <!--右下角显示“发送”-->
<input confirm-type='search' /> <!--右下角显示“搜索”-->
<input confirm-type='next' /> <!--右下角显示“下一个”-->
<input confirm-type='go' /> <!--右下角显示“前往”-->
<input confirm-type='done' /> <!--右下角显示“完成”-->

标签label

用来改进表单组件的可用性，使用for属性找到对应的id，或者将控件放在该标签下，点击时会触发对应的控件。

<checkbox-group>
    <checkbox id='apple' value='apple' checked /> 
    <label for='apple'>苹果</label>
</checkbox-group>

<checkbox-group>
    <label>
        <checkbox value='apple' checked />苹果
    </label>
</checkbox-group>

表单form

开关选择器switch

<switch checked />选中
<switch />没选中

多行文本框textarea

导航组件

导航组件navigator用于点击跳转页面链接

<navigator url="../new/new">
   <button type="primary">跳转到新页面打开新内容</button>
</navigator>

<navigator url="跳转的新页面地址?参数1=值1&参数2=值2&…参数N=值N">

<navigator url="../new/new?date=20180803">
   <button type="primary">跳转到新页面打开新内容</button>
</navigator>