组件列表
收藏
我的收藏

基础组件

小程序框架为开发者提供了一系列基础组件，开发者可以通过组合这些基础组件进行业务开发。详情请参见基础组件。

基础内容

组件	描述
text 文本	文本组件。
rich-text 富文本	富文本组件。
progress 进度条	进度条。
icon 图标	图标。

视图容器

组件	描述
view 视图容器	视图容器，相当于 html 中的 div 。
scroll-view 可滚动视图区域	可滚动视图区域，可实现横向滚动和竖向滚动。使用竖向滚动时，需要给定一个固定高度，可以通过 ttss 来设置 height。组件属性的长度单位支持 px 和 rpx。
swiper 滑块视图容器	滑块视图容器。内部只允许使用 swiper-item 组件来描述具体滑块内容，否则会导致未定义的行为。
swiper-item	滑块视图容器子项，仅可放置在 swiper 组件中，宽高自动设置为 100%。
movable-area 可移动视图区域	movable-view 的可移动区域。
movable-view 可移动视图容器	可移动的视图容器，在页面中可以拖拽滑动。movable-view 必须在 movable-area 组件中，并且必须是直接子节点，否则不能移动。

表单

组件	描述
button 按钮	按钮，用于强调操作并引导用户去点击。
checkbox 多选选择器	多选项目。
checkbox-group 多项选择器	多项选择器组，内部由多个 checkbox 组成。
form 表单	表单，将组件内的用户输入的 switch、input、checkbox、slider、radio、picker 、textarea 提交。
input 输入框	输入框组件，用于键盘交互。
label 表单组件标签	用于改进表单组件的可用性。可使用 for 属性找到对应组件的 id，或者将组件放在该标签下。当点击时，就会触发对应的组件。for 优先级高于内部组件，内部有多个组件的时候默认触发第一个组件。
picker 底部弹起的滚动选择器	从底部弹起的滚动选择器，现支持五种选择器，通过 `mode` 属性来设置，分别是 `selector` 普通选择器，`multiSelector` 多列选择器，`time` 时间选择器，`date` 日期选择器，`region` 省市区选择器，默认是 `selector` 普通选择器。
picker-view 嵌入页面的滚动选择器	picker-view 是嵌入页面的滚动选择器。子组件必须是 picker-view-column。
picker-view-column 嵌入页面的滚动选择器子项	滚动列，需要配合 picker-view 组件使用，作为 picker-view 其中的一列，其高度会自动设置成与 picker-view 的高度保持一致。
radio 单选项目	单项选择器。
radio-group 单向选择器	单项选择器，内部由多个 radio 组成。
slider 滑动选择器	滑动选择器。
switch 开关选择器	开关选择器。
textarea 多行文本输入框	多行文本输入框。该组件是原生组件，支持同层渲染。

导航

组件	描述
navigator 页面链接	页面链接，控制小程序的跳转。`navigator`子节点的背景色应为透明色。

媒体组件

组件	描述
image 图片	图片。支持 JPG、PNG、SVG、WEBP、GIF 等格式。
video 视频	视频组件。相关 API 请参考 tt.createVideoContext。
live-preveiw直播预览流组件	组件包含两个区域：头部区域以及直播预览流区域。使用该功能前开发者需要去开发者后台为对应的抖音号申请直播预览流组件能力，详情见引导跳转到直播间能力
camera 相机	相机组件。该组件为原生组件。通过 tt.createCameraContext 可以获取相机上下文操作相机。

画布

组件	描述
canvas 画布	画布。可使用 JS 操作 Canvas 上下文进行绘制。

地图

组件	描述
map 地图	地图组件。相关 API tt.createMapContext。

开放能力

组件	描述
web-view 网页容器	该组件是一个用于承载网页的容器，将 H5 切入到小程序内部，铺满整个页面。业务域名配置
ad 广告	广告组件。
open-data 开放数据	用于展示字节生态开放数据。
aweme-data 直播间状态组件	直播间状态组件。使用该功能前开发者需要去开发者后台为对应的抖音号申请直播呼吸灯组件能力，详情见引导跳转到直播间能力
button组件IM客服能力	支持小程序拉起 IM 客服能力，需要将 button 组件 open-type 的值设置为 im，详见抖音 IM 客服。
button组件平台客服能力	支持小程序拉起平台能力，需要将 button 组件 open-type 的值设置为 platformIm。
button组件跳转视频播放页	支持小程序跳转到视频播放页，需要将 button 组件 open-type 的值设置为 navigateToVideoView。
button组件跳转抖音个人号主页	支持小程序跳转抖音号个人页，需要将 button 组件 open-type 的值设置为 openAwemeUserProfile。使用该功能前开发者需要至开发者后台-设置-关联设置-抖音号管理为对应的抖音号申请跳转抖音号个人页能力，具体信息请参考关注抖音号
button组件跳转直播间	支持小程序打开直播间，需要将 button 组件 open-type 的值设置为 openWebcastRoom。使用该功能前开发者需要至开发者后台-设置-关联设置-抖音号管理为对应的抖音号申请跳转抖音直播间能力，并在能力-直播间基础中申请该能力，具体信息请参考引导跳转到直播间

原生组件

原生组件是指在小程序页面中通过客户端实现的组件，包括：

•

textarea

•

video

•

live-player

•

map

•

input

•

ad

•

canvas（V2 版本）

详情请参见原生组件。

该文档是否有帮助？

本页导读