微信小程序组建大全
By
科技生活
at 2023-07-28 • 0人收藏 • 134人看过
视图容器
| 名称 | 功能 | |
|---|---|---|
| cover-image | 覆盖在原生组件之上的图片视图 | |
| cover-view | 覆盖在原生组件之上的文本视图 | |
| grid-view | Skyline 下网格布局容器 | |
| list-view | 列表布局容器，仅支持作为 <scroll-view type="custom"> 模式的直接子节点或 sticky-section 组件直接子节点 | |
| match-media | media query 匹配检测节点 | |
| movable-area | movable-view的可移动区域 | |
| movable-view | 可移动的视图容器，在页面中可以拖拽滑动 | |
| page-container | 页面容器 | |
| root-portal | 使整个子树从页面中脱离出来，类似于在 CSS 中使用 fixed position 的效果 | |
| scroll-view | 可滚动视图区域 | |
| share-element | 共享元素 | |
| sticky-header | 吸顶布局容器，仅支持作为 <scroll-view type="custom"> 模式的直接子节点或 sticky-section 组件直接子节点 | |
| sticky-section | 吸顶布局容器，仅支持作为 <scroll-view type="custom"> 模式的直接子节点 | |
| swiper | 滑块视图容器 | |
| swiper-item | 仅可放置在swiper组件中，宽高自动设置为100% | |
| view | 视图容器 |
| 名称 | 功能 | |
|---|---|---|
| cover-image | 覆盖在原生组件之上的图片视图 | |
| cover-view | 覆盖在原生组件之上的文本视图 | |
| grid-view | Skyline 下网格布局容器 | |
| list-view | 列表布局容器，仅支持作为 <scroll-view type="custom"> 模式的直接子节点或 sticky-section 组件直接子节点 | |
| match-media | media query 匹配检测节点 | |
| movable-area | movable-view的可移动区域 | |
| movable-view | 可移动的视图容器，在页面中可以拖拽滑动 | |
| page-container | 页面容器 | |
| root-portal | 使整个子树从页面中脱离出来，类似于在 CSS 中使用 fixed position 的效果 | |
| scroll-view | 可滚动视图区域 | |
| share-element | 共享元素 | |
| sticky-header | 吸顶布局容器，仅支持作为 <scroll-view type="custom"> 模式的直接子节点或 sticky-section 组件直接子节点 | |
| sticky-section | 吸顶布局容器，仅支持作为 <scroll-view type="custom"> 模式的直接子节点 | |
| swiper | 滑块视图容器 | |
| swiper-item | 仅可放置在swiper组件中，宽高自动设置为100% | |
| view | 视图容器 |
基础内容
基础内容
| 名称 | 功能 | |
|---|---|---|
| icon | 图标组件 | |
| progress | 进度条 | |
| rich-text | 富文本 | |
| text | 文本 |
表单组件
| 名称 | 功能 | |
|---|---|---|
| button | 按钮 | |
| checkbox | 多选项目 | |
| checkbox-group | 多项选择器，内部由多个checkbox组成 | |
| editor | 富文本编辑器，可以对图片、文字进行编辑 | |
| form | 表单 | |
| input | 输入框 | |
| keyboard-accessory | 设置 input / textarea 聚焦时键盘上方 cover-view / cover-image 工具栏视图 | |
| label | 用来改进表单组件的可用性 | |
| picker | 从底部弹起的滚动选择器 | |
| picker-view | 嵌入页面的滚动选择器 | |
| picker-view-column | 滚动选择器子项 | |
| radio | 单选项目 | |
| radio-group | 单项选择器，内部由多个 radio 组成 | |
| slider | 滑动选择器 | |
| switch | 开关选择器 | |
| textarea | 多行输入框 |
导航
| 名称 | 功能 | |
|---|---|---|
| functional-page-navigator | 仅在插件中有效，用于跳转到插件功能页 | |
| navigator | 页面链接 |
媒体组件
| 名称 | 功能 | |
|---|---|---|
| audio | 音频 | |
| camera | 系统相机 | |
| channel-live | 小程序内嵌视频号直播组件，展示视频号直播状态和封面，并无弹窗跳转至视频号 | |
| channel-video | 小程序内嵌视频号视频组件，支持在小程序中播放视频号视频，并无弹窗跳转至视频号 | |
| image | 图片 | |
| live-player | 实时音视频播放（v2.9.1 起支持同层渲染） | |
| live-pusher | 实时音视频录制（v2.9.1 起支持同层渲染） | |
| video | 视频（v2.4.0 起支持同层渲染） | |
| voip-room | 多人音视频对话 |
地图
| 名称 | 功能 | |
|---|---|---|
| map | 地图 v2.7.0 起支持同层渲染 |
画布
| 名称 | 功能 | |
|---|---|---|
| canvas | 画布 |
开放能力
| 名称 | 功能 | |
|---|---|---|
| web-view | 承载网页的容器 | |
| ad | Banner 广告 | |
| ad-custom | 原生模板 广告 | |
| official-account | 公众号关注组件 | |
| open-data | 用于展示微信开放的数据 |
原生组件说明
| 名称 | 功能 | |
|---|---|---|
| native-component | 小程序中的部分组件是由客户端创建的原生组件 |
无障碍访问
| 名称 | 功能 | |
|---|---|---|
| aria-component | 满足视障人士对于小程序的访问需求 |
导航栏
| 名称 | 功能 | |
|---|---|---|
| navigation-bar | 页面导航条配置节点，用于指定导航栏的一些属性 |
页面属性配置节点
| 名称 | 功能 | |
|---|---|---|
| page-meta | 页面属性配置节点，用于指定页面的一些属性、监听页面事件 |
登录后方可回帖