:wxfrwk:`基础组件 <view/component>`
============================================

框架为开发者提供了一系列基础组件，开发者可以通过组合这些基础组件进行快速开发。详细介绍请参考 :ref:`component` 文档。

什么是组件：

- 组件是视图层的基本组成单元。
- 组件自带一些功能与微信风格一致的样式。
- 一个组件通常包括 开始标签 和 结束标签，属性 用来修饰这个组件，内容 在两个标签之内。

.. code: html

  <tagname property="value">
    Content goes here ...
  </tagname>

.. tip:: 所有组件与属性都是小写，以连字符-连接

属性类型
-----------------------------------

+--------------+----------------+-------------------------------------------------------------------------------------------------------------------------------------+
|     类型     |      描述      |                                                                注解                                                                 |
+==============+================+=====================================================================================================================================+
| Boolean      | 布尔值         | 组件写上该属性，不管是什么值都被当作 true；只有组件上没有该属性时，属性值才为false。如果属性值为变量，变量的值会被转换为Boolean类型 |
+--------------+----------------+-------------------------------------------------------------------------------------------------------------------------------------+
| Number       | 数字           | 1, 2.5                                                                                                                              |
+--------------+----------------+-------------------------------------------------------------------------------------------------------------------------------------+
| String       | 字符串         | "string"                                                                                                                            |
+--------------+----------------+-------------------------------------------------------------------------------------------------------------------------------------+
| Array        | 数组           | [ 1, "string" ]                                                                                                                     |
+--------------+----------------+-------------------------------------------------------------------------------------------------------------------------------------+
| Object       | 对象           | { key: value }                                                                                                                      |
+--------------+----------------+-------------------------------------------------------------------------------------------------------------------------------------+
| EventHandler | 事件处理函数名 | "handlerName" 是 :ref:`Page` 中定义的事件处理函数名                                                                                 |
+--------------+----------------+-------------------------------------------------------------------------------------------------------------------------------------+
| Any          | 任意属性       |                                                                                                                                     |
+--------------+----------------+-------------------------------------------------------------------------------------------------------------------------------------+

公共属性
-----------------------------------

所有组件都有以下属性：

+----------------+--------------+----------------+------------------------------------------+
|     属性名     |     类型     |      描述      |                   注解                   |
+================+==============+================+==========================================+
| id             | String       | 组件的唯一标示 | 保持整个页面唯一                         |
+----------------+--------------+----------------+------------------------------------------+
| class          | String       | 组件的样式类   | 在对应的 WXSS 中定义的样式类             |
+----------------+--------------+----------------+------------------------------------------+
| style          | String       | 组件的内联样式 | 可以动态设置的内联样式                   |
+----------------+--------------+----------------+------------------------------------------+
| hidden         | Boolean      | 组件是否显示   | 所有组件默认显示                         |
+----------------+--------------+----------------+------------------------------------------+
| data-*         | Any          | 自定义属性     | 组件上触发的事件时，会发送给事件处理函数 |
+----------------+--------------+----------------+------------------------------------------+
| bind* / catch* | EventHandler | 组件的事件     | 详见 :ref:`wxml-event`                   |
+----------------+--------------+----------------+------------------------------------------+

特殊属性
-----------------------------------

几乎所有组件都有各自定义的属性，可以对该组件的功能或样式进行修饰，请参考各个 :ref:`component` 的定义。