版本: V7参数 | 必填 | 值类型 | 内容 | 备注 |
---|
title | 是 | string | 导航栏标题 | 一般不超过八个字,六字及以下为佳 |
desc | 否 | string | 页面描述 | 会显示在页脚 |
author | 否 | string[] | string | 页面的作者 | 会显示在页脚 |
time | 否 | Date | 页面更新时间 | 会显示在页脚 |
grey | 否 | boolean | 使用灰色背景 | 默认为白色背景 |
content | 否 | ComponentConfig[] | 页面的内容 | 数组的每个对象会最终渲染为一个组件 |
cite | 否 | string | string[] | 页面引用链接 | |
outdated | 否 | boolean | 是否已过时 | 可展示一条“页面过时”提示 |
shareable | 否 | boolean | 是否可被分享 | 是否可以使用小程序的界面分享,默认为 false |
高级参数
高级参数 | 必填 | 值类型 | 内容 | 备注 |
---|
action | 否 | string | false | 左上角按钮触发函数 | 不填时执行返回,设置为 false 会隐藏按钮 |
hidden | 否 | boolean | 隐藏导航栏 | 默认显示导航栏 |
footer | 否 | boolean | 是否显示页脚 | 默认为 true |
content
的每个元素都为一个对象,该对象会最终渲染为一个组件。
每个配置对象有一个固定的键 tag
来决定渲染的组件。有效的 tag
值及对应的渲染结果如下:
标题
参数 | 必填 | 值类型 | 内容 |
---|
text | 是 | string | 大标题文字 |
高级参数
高级参数 | 必填 | 值类型 | 内容 | 备注 |
---|
style | 否 | string | Record<string, string> | 标题 css 样式 | |
文字块,支持所有的跳转参数。
参数 | 必填 | 值类型 | 内容 | 备注 |
---|
header | 否 | string | false | 标题 | 填 false 会取消具有样式时的默认标题 |
text | 是 | string | string[] | 文字内容 | |
type | 否 | 'tip' | 'warn' | 'danger' | 'info' | 'none' | 文字块样式 | 默认为 'none' |
align | 否 | 'left' | 'right' | 'center' | 'justify' | 段落对齐方式 | 默认为 'justify' |
高级参数
高级参数 | 必填 | 值类型 | 内容 | 备注 |
---|
style | 否 | string | Record<string, string> | 文字样式 | 填入 css 样式,会对段落的默认样式进行覆盖,该样式不会影响到标题 |
段落,支持所有的跳转参数。
参数 | 必填 | 值类型 | 内容 | 备注 |
---|
header | 否 | string | false | 标题 | 填 false 会取消具有样式时的默认标题 |
text | 是 | string | string[] | 段落文字内容 | |
type | 否 | 'tip' | 'warn' | 'danger' | 'info' | 文字块样式 | 不填无额外样式 |
path | 否 | string | 对应页面的路径 | 仅设置 type 时可用 |
align | 否 | 'left' | 'right' | 'center' | 'justify' | 段落对齐方式 | 默认为 'justify' |
高级参数
高级参数 | 必填 | 值类型 | 内容 | 备注 |
---|
style | 否 | string | Record<string, string> | 段落文字样式 | 填入 css 样式,会对段落的默认样式进行覆盖,该样式不会影响到标题 |
无序列表,支持所有的跳转参数。
参数 | 必填 | 值类型 | 内容 | 备注 |
---|
header | 否 | string | false | 标题 | 填 false 会取消具有样式时的默认标题 |
text | 是 | string | string[] | 无序列表项文字内容 | |
type | 否 | 'tip' | 'warn' | 'danger' | 'info' | 文字块样式 | 不填无额外样式 |
path | 否 | string | 对应页面的路径 | 仅设置 type 时可用 |
高级参数
高级参数 | 必填 | 值类型 | 内容 | 备注 |
---|
style | 否 | string | Record<string, string> | 列表文字样式 | 填入 css 样式,会对段落的默认样式进行覆盖,该样式不会影响到标题 |
有序列表,支持所有的跳转参数。
参数 | 必填 | 值类型 | 内容 | 备注 |
---|
header | 否 | string | false | 标题 | 填 false 会取消具有样式时的默认标题 |
text | 是 | string | string[] | 有序列表项文字内容 | |
type | 否 | 'tip' | 'warn' | 'danger' | 'info' | 文字块样式 | 不填无额外样式 |
path | 否 | string | 对应页面的路径 | 仅设置 type 时可用 |
高级参数
高级参数 | 必填 | 值类型 | 内容 | 备注 |
---|
style | 否 | string | Record<string, string> | 列表文字样式 | 填入 css 样式,会对段落的默认样式进行覆盖,该样式不会影响到标题 |
带有图标、文字、描述的列表。
参数 | 必填 | 值类型 | 内容 | 备注 |
---|
header | 否 | string | false | 头部标题 | 不填会在标题所在处留空占位,设置为 false 来取消留空占位 |
footer | 否 | string | 尾部标题 | |
items | 是 | SimpleList[] | 列表内容 | |
列表项,支持所有的 跳转参数:
参数 | 必填 | 值类型 | 内容 |
---|
icon | 否 | string | 列表图标的简称或在线网址 |
text | 是 | string | 列表项文字 |
desc | 否 | string | 列表项描述,显示在尾部 |
图片组件,可附带说明。点击可预览、支持放大与下载。
参数 | 必填 | 值类型 | 内容 | 备注 |
---|
src | 是 | string | 图片地址 | |
desc | 否 | string | 图片的描述文字 | 填入后会自动最前加入一个三角号,不填则没有描述文字 |
高级参数
高级参数 | 必填 | 值类型 | 内容 | 备注 |
---|
lazy | 否 | boolean | 图片懒加载 | 默认执行,设置 false 取消 |
imgmode | 否 | string | 图片显示模式,详见 图片模式 | 默认为 'widthFix' |
表格组件
参数 | 必填 | 值类型 | 内容 | 备注 |
---|
header | 是 | string[] | 表头 | |
body | 是 | string[][] | 表格内容 | |
caption | 否 | string | 表格标题 | |
文档组件,支持查看与下载
参数 | 必填 | 值类型 | 内容 | 备注 |
---|
name | 是 | string | 文档名称 | |
url | 是 | string | 文档在线路径 | |
header | 否 | string | 组件标题 | |
支持情况
仅支持 doc、docx、ppt、pptx、xls、xlsx、pdf、jpg、jpeg、png、gif。
高级参数
高级参数 | 必填 | 值类型 | 内容 | 备注 |
---|
downloadable | 否 | boolean | 该文档是否可下载 | 默认为 true |
电话组件,支持拨打电话与快速保存联系人。
参数 | 必填 | 值类型 | 内容 |
---|
num | 是 | string | number | 联系人电话号码 |
header | 否 | string | 组件标题 |
fName | 是 | string | 联系人的名 |
lName | 否 | string | 联系人的姓 |
org | 否 | string | 联系人所在公司 |
remark | 否 | string | 联系人的备注 |
workNum | 否 | string | number | 联系人的工作电话 |
hostNum | 否 | string | number | 联系人的公司电话 |
homeNum | 否 | string | number | 联系人的住宅电话 |
nick | 否 | string | 联系人的昵称 |
avatar | 否 | string | 联系人头像图片路径(仅限本地路径) |
title | 否 | string | 联系人的职位 |
site | 否 | string | 联系人的网站 |
mail | 否 | string | 联系人的电子邮件 |
wechat | 否 | string | 联系人的微信号 |
province | 否 | string | 联系人的地址省份 |
city | 否 | string | 联系人的地址城市 |
street | 否 | string | 联系人的地址街道 |
postCode | 否 | string | number | 联系人的地址邮政编码 |
动作组件,允许快速复制文字或跳转网页
参数 | 必填 | 值类型 | 内容 |
---|
content | 是 | string | 动作内容 |
header | 否 | string | 可选的组件标题 |
介绍组件,用于主体 Logo、网址、媒体号、口号展示。
参数 | 必填 | 值类型 | 内容 | 备注 |
---|
name | 是 | string | 主体名称 | |
logo | 是 | string | 头像图标在线地址 | |
detail | 否 | string | 主体的全称 | |
desc | 否 | string | 主体描述 | |
qq | 否 | number | 主体的 QQ 号 | |
qqid | 否 | string | 主体的 QQ Openid | |
qqcode | 否 | string | 主体的 QQ 二维码地址 | |
wxid | 否 | string | 主体的微信公众号 ID | |
wxcode | 否 | string | 主体的微信二维码地址 | |
account | 否 | string | 主体的微信公众号配置文件 ID | |
loc | 是 | ${number},${number} | 位置信息 | latitude,longitude 格式 |
mail | 否 | string | 主体的邮箱地址 | |
site | 否 | string | 主体的网站地址 | |
位置组件,用于在地图上显示位置并允许详情与导航。
参数 | 必填 | 值类型 | 内容 | 备注 |
---|
header | 是 | string | 位置标题 | |
points | 是 | Point[] | 展示地点 | 数组的每个元素对应一个地点 |
navigate | 否 | false | 是否允许导航 | 仅在企业主体微信小程序上可用 |
点位配置
参数 | 必填 | 值类型 | 内容 | 备注 |
---|
loc | 是 | ${number},${number} | 位置信息 | latitude,longitude 格式 |
name | 否 | string | 点位名称 | 默认同 title |
detail | 否 | string | 点位详情文字 | 默认为 详情 |
path | 否 | string | 地点详情路径 | 基于地图页面文件夹 |
轮播图
参数 | 必填 | 值类型 | 内容 | 备注 |
---|
images | 是 | string[] | 展示的图片地址 | 将所有图片按顺序设置为数组元素 |
fill | 否 | boolean | 组件是否填满屏幕宽度 | 默认为 false |
indicatorDots | 否 | boolean | 是否显示面板指示点 | 默认显示,设置 false 取消 |
dotColor | 否 | string | 指示点颜色 | 默认为#ffffff88 |
autoplay | 否 | boolean | 自动切换 | 默认为 true |
interval | 否 | number | 自动切换时间间隔 | 默认为 5000 |
duration | 否 | number | 滑动动画时长 | 默认为 500 |
circular | 否 | boolean | 是否衔接滑动 | 默认为 true |
vertical | 否 | boolean | 滑动方向是否纵向 | 默认为 false |
imgmode | 否 | string | 详见图片模式 | 默认为 aspectFill |
高级参数
高级参数 | 必填 | 值类型 | 内容 | 备注 |
---|
class | 否 | string | carousel 项目的类名 | 默认为 width:100%;height:400rpx; |
style | 否 | string | carousel 项目的样式 | 填入 css 样式 |
imgClass | 否 | string | carousel 中图片的类名 | 默认为 width:100%!important;height:100%!important; |
preMargin | 否 | string | 前一项露出边距 | 默认为 0px ,接受 px 和 rpx 值 |
nextMargin | 否 | string | 后一项露出边距 | 默认为 0px ,接受 px 和 rpx 值 |
change | 否 | string | carousel 改变时触发的函数名称 | 默认不触发函数 |
animation | 否 | string | carousel 动画结束时触发的函数名称 | 默认不触发函数 |
卡片组件,支持所有的 跳转参数
参数 | 必填 | 值类型 | 内容 |
---|
src | 否 | string | 卡片图片地址 |
type | 否 | 'page' | 'web' | 卡片类型 |
title | 是 | string | 卡片标题 |
desc | 否 | string | 卡片描述 |
logo | 否 | string | 卡片 logo 地址 |
name | 否 | string | 卡片 logo 名称 |
九宫格组件,用于分类展示与跳转
参数 | 必填 | 值类型 | 内容 |
---|
header | 否 | string | false | 九宫格的标题文字,设置 false 可取消留空占位 |
footer | 否 | string | 九宫格的尾部文字 |
items | 是 | GridItem[] | 该数组的每个元素均为一个格子内容 |
九宫格项,支持所有的 跳转参数
参数 | 必填 | 值类型 | 内容 |
---|
icon | 是 | string | 九宫格的图标的简称或在线网址 |
text | 是 | string | 九宫格文字 |
color | 是 | 'blue' | 'orange' | 'red' | 'purple' | 'cyan' | 'olive' | 'mauve' | 'grey' | Android 主题下的颜色 |
name | 是 | string | 对应的英文文字 |
path | 否 | string | 对应配置文件的相对或绝对路径(不带后缀名),以 / 结尾默认为 index |
参数 | 必填 | 值类型 | 内容 |
---|
src | 是 | string | 媒体文件地址 |
name | 否 | string | 音频名字 |
author | 否 | string | 音频作者 |
poster | 否 | string | 音频封面 |
高级参数
高级参数 | 必填 | 值类型 | 内容 |
---|
autoplay | 否 | string | 是否自动播放,默认为 false |
loop | 否 | boolean | 是否循环播放 |
参数 | 必填 | 值类型 | 内容 | 备注 |
---|
src | 是 | string | 媒体文件地址 | |
poster | 否 | string | 视频封面的图片网络资源地址 | controls 为 false 时无效 |
高级参数
高级参数 | 必填 | 值类型 | 内容 | 备注 |
---|
controls | 否 | boolean | 是否显示默认控件 | |
loop | 否 | boolean | 是否循环播放 | controls 为 false 时无效 |
danmu-list | 否 | Object Array | 弹幕列表 | |
danmu-btn | 否 | boolean | 是否显示弹幕按钮 | 只在初始化有效 |
带有更多功能的列表
参数 | 必填 | 值类型 | 内容 | 备注 |
---|
header | 否 | string | false | 头部标题 | 不填会在标题所在处留空占位,设置为 false 来取消留空占位 |
footer | 否 | string | 尾部标题 | |
items | 是 | AdvancedList[] | 列表内容 | |
下面参数是通用于每一个选项的参数,同时每个选项支持所有的 跳转参数
参数 | 必填 | 值类型 | 内容 |
---|
icon | 否 | string | 列表图标的本地路径或在线网址 |
text | 是 | string | 列表单元的显示文字 |
hidden | 否 | boolean | 设置为 true 时隐藏该列表项 |
desc | 否 | string | 列表内容的描述 |
设置 type
为 'navigator'
使用微信 navigator 的原生能力。
参数 | 必填 | 值类型 | 内容 |
---|
openType | 否 | string | 小程序提供的开放能力 |
target | 否 | string | 跳转目标 |
设置 type
为 'switch'
渲染一个开关。
参数 | 必填 | 值类型 | 内容 | 备注 |
---|
key | 是 | string | 所控变量在 storage 中的 key 值 | |
handler | 否 | string | 开关对应的函数名称 | 不填仅改变 storage 中 swiKey 的值 |
color | 否 | string | 开关颜色 | 同 css 的 color 填入 rgb 代码 |
设置 type
为 'picker'
渲染一个选择器。
参数 | 必填 | 值类型 | 内容 | 备注 |
---|
select | 是 | Value[] | 选择器中包含的值 | |
key | 是 | string | 选择器所改变的变量在本地存储中的名称 | |
handler | 否 | string | picker 选择器对应的函数名称 | 不填仅改变界面显示值与 storage 中 key 的值 |
single | 否 | boolean | 设置 true 时为单列选择器 | 默认为多列选择器 |
inlay | 否 | boolean | 是否为嵌入式 picker | 默认为 false ,弹出式 picker |
设置 type
为 'button'
渲染一个自定义按钮。
参数 | 必填 | 值类型 | 内容 | 备注 |
---|
handler | 是 | string | 按钮函数名 | 填入按钮点击后触发的函数名 |
disabled | 否 | boolean | 是否禁用按钮 | 默认为 false (不禁用),一般仅供开发界面时使用 |
设置 type
为 'slider'
渲染一个自定义滑块。
参数 | 必填 | 值类型 | 内容 | 备注 |
---|
key | 是 | string | 滑块 Key 值 | 滑块所控变量在 storage 中的 key 值 |
handler | 否 | string | 滑块对应的的函数名称 | 不填仅改变界面显示值与 storage 中 key 的值 |
min | 否 | number | 滑块的最小值 | 默认为 0 |
max | 否 | number | 滑块的最大值 | 默认为 100 |
step | 否 | number | 滑块的步长 | 默认为 1 |
指向配置文件页面
参数 | 必填 | 值类型 | 内容 |
---|
path | 是 | string | 对应配置文件的相对或绝对路径(不带后缀名),以 / 结尾默认为 index |
指向程序内页面 (高级)
参数 | 必填 | 值类型 | 内容 |
---|
url | 是 | string | 指向的小程序页面短名称或完整路径,可带参数 |
指向网页
指向其他小程序
参数 | 必填 | 值类型 | 内容 |
---|
appId | 是 | string | 需要跳转的小程序 ID |
path | 否 | string | 跳转到的小程序页面路径 (可带参数),不填则默认跳转到首页 |
- widthFix: 宽度不变,高度自动变化,保持原图宽高比不变;
- scaleToFill: 保持纵横比缩放图片,使图片的宽高完全拉伸至填满 image 元素;
- aspectFit: 保持纵横比缩放图片,使图片的长边能完全显示出来;
- aspectFill: 保持纵横比缩放图片,只保证图片的短边能完全显示出来;
- top: 不缩放图片,只显示图片的顶部区域;
- bottom: 不缩放图片,只显示图片的底部区域;
- center: 不缩放图片,只显示图片的中间区域;
- left: 不缩放图片,只显示图片的左边区域;
- right: 不缩放图片,只显示图片的右边区域;
- top left: 不缩放图片,只显示图片的左上边区域;
- top right: 不缩放图片,只显示图片的右上边区域;
- bottom left: 不缩放图片,只显示图片的左下边区域;
- bottom right: 不缩放图片,只显示图片的右下边区域;