小程序框架为开发者提供了一系列组件,开发者可以通过组合这些组件进行业务开发。
数据绑定
通过 mustache 语法两对大括号 {{}}
绑定动态数据,可查看 。
共有属性
所有的组件都包含以下属性:
属性类型描述idstring组件的唯一标识。classstring样式类。stylestring内联样式。data-*any自定义属性。当事件触发时,会将自定义属性传递给事件处理函数。on / catcheventhandle事件绑定,遵循驼峰命名规范,例如 ontap 。 详情可查看 。"}" id="5eac7215">
属性 | 类型 | 描述 |
id | string | 组件的唯一标识。 |
class | string | 样式类。 |
style | string | 内联样式。 |
data-* | any | 自定义属性。当事件触发时,会将自定义属性传递给事件处理函数。 |
on / catch | eventhandle | 事件绑定,遵循驼峰命名规范,例如 ontap 。 详情可查看 。 |
属性类型
每个组件都有一系列的属性配置,每个属性值都有类型要求。
类型描述boolean布尔值。number数字。string字符串。array数组。object对象。eventhandle事件处理函数。需在 中定义事件处理函数名对应的实现。any任意类型。"}" id="7dd72709">
类型 | 描述 |
boolean | 布尔值。 |
number | 数字。 |
string | 字符串。 |
array | 数组。 |
object | 对象。 |
eventhandle | 事件处理函数。需在 中定义事件处理函数名对应的实现。 |
any | 任意类型。 |
组件包括视图容器、基础内容、表单组件、导航、媒体组件、画布、地图、开放组件以及无障碍访问类型组件,具体组件信息可通过下文列表查询。
视图容器
名称功能说明视图容器。滑块视图容器。可滚动视图区域。覆盖在原生组件之上的文本视图。覆盖在原生组件之上的图片视图,可覆盖的原生组件同 cover-view,支持嵌套在 cover-view 里。用以提供更友好的小程序响应式布局方案。可指定一组 media query 规则,满足匹配时,该节点展示。可移动的视图容器。movable-view 的可移动区域。页面容器,页面内存在该容器时,当用户进行返回操作,关闭该容器不关闭页面。共享元素是一种动画形式,表现为元素像是在页面间穿越一样。portal容器,使整个子树从页面中脱离出来,类似于在 css 中使用 fixed position 的效果。"}" id="c15a3dc5">
名称 | 功能说明 |
视图容器。 | |
滑块视图容器。 | |
可滚动视图区域。 | |
覆盖在原生组件之上的文本视图。 | |
覆盖在原生组件之上的图片视图,可覆盖的原生组件同 cover-view,支持嵌套在 cover-view 里。 | |
用以提供更友好的小程序响应式布局方案。可指定一组 media query 规则,满足匹配时,该节点展示。 | |
可移动的视图容器。 | |
movable-view 的可移动区域。 | |
页面容器,页面内存在该容器时,当用户进行返回操作,关闭该容器不关闭页面。 | |
共享元素是一种动画形式,表现为元素像是在页面间穿越一样。 | |
portal容器,使整个子树从页面中脱离出来,类似于在 css 中使用 fixed position 的效果。 |
基础内容
名称功能说明文本。图标。进度条。富文本组件。"}" id="f7e094e7">
名称 | 功能说明 |
文本。 | |
图标。 | |
进度条。 | |
富文本组件。 |
表单组件
名称功能说明按钮。表单。用来改进表单组件的可用性。输入框。多行输入框。单选按钮。单选项目组。多项选择器。多项选择器组。单选开关。滑动选择器。嵌入页面的滚动选择器。从底部弹起的滚动选择器。"}" id="441fff26">
名称 | 功能说明 |
按钮。 | |
表单。 | |
用来改进表单组件的可用性。 | |
输入框。 | |
多行输入框。 | |
单选按钮。 | |
单选项目组。 | |
多项选择器。 | |
多项选择器组。 | |
单选开关。 | |
滑动选择器。 | |
嵌入页面的滚动选择器。 | |
从底部弹起的滚动选择器。 |
导航
名称功能说明页面链接。"}" id="b857956f">
名称 | 功能说明 |
页面链接。 |
媒体组件
名称功能说明图片。视频。动画。相机。"}" id="9b571ac5">
名称 | 功能说明 |
图片。 | |
视频。 | |
动画。 | |
相机。 |
画布
名称功能说明画布。"}" id="37213bd8">
名称 | 功能说明 |
画布。 |
地图
名称功能说明地图组件。地图组件的能力扩展,使小程序地图具备动态定制地图覆盖物渲染布局的能力。"}" id="6cec6346">
名称 | 功能说明 |
地图组件。 | |
地图组件的能力扩展,使小程序地图具备动态定制地图覆盖物渲染布局的能力。 |
开放组件
名称功能说明承载 h5 网页的组件。关注生活号组件。智能客服组件。异常视图组件。加入商家群聊。嵌入式订阅组件。"}" id="966226a1">
名称 | 功能说明 |
承载 h5 网页的组件。 | |
关注生活号组件。 | |
智能客服组件。 | |
异常视图组件。 | |
加入商家群聊。 | |
嵌入式订阅组件。 |
无障碍访问
名称功能说明无障碍访问。"}" id="6bd96699">
名称 | 功能说明 |
无障碍访问。 |
页面属性配置节点
名称功能说明指定页面的一些属性、监听页面事件。"}" id="717edc60">
名称 | 功能说明 |
指定页面的一些属性、监听页面事件。 |