按钮
可使用按钮实现用户交互
参数说明
名称 | 是否必填 | 参数类型 | 说明 |
---|---|---|---|
button | 是 | object | 按钮组件配置 |
∟ tag | 是 | string | 组件的标签,按钮组件tag=button |
∟ style | 是 | string | 按钮样式,支持以下类型: - normal :蓝色字体按钮,有边框(主要按钮)- secondary :黑色字体按钮,有边框(辅助按钮)- warn :红色字体按钮,有边框(警示按钮)- disable :灰色字体按钮,有边框(禁用按钮)- text :黑色字体按钮,无边框- primary_text :蓝色字体按钮,无边框- danger_text :红色字体按钮,无边框- primary_filled :蓝底白字按钮- danger_filled :红底白字按钮 |
∟ text | 是 | object | 文本内容 |
∟ ∟ type | 是 | string | 文本类型,支持 plain 和 markdown 两种类型 |
∟ ∟ content | 是 | string | 文本内容 |
∟ link | 否 | object | 组件整体的跳转链接 |
∟ ∟ url | 是 | string | 默认的链接地址 |
∟ ∟ pc_url | 否 | string | PC 端的链接地址 |
∟ ∟ ios_url | 否 | string | iOS 端的链接地址 |
∟ ∟ android_url | 否 | string | Android 端的链接地址 |
∟ key | 否 | string | 用于回传标识,会将该字段值回传(回传必须) |
∟ required | 否 | bool | 控制用户回传参数是否必填,false:非必传,true:必传。默认为 false |
∟ modal | 否 | object | 按钮操作后的弹窗 |
∟ ∟ tag | 是 | string | 组件的标签,弹窗组件tag=modal |
∟ ∟ header | 是 | string | 弹窗的标题 |
∟ ∟ content | 是 | array | 弹窗内的填写框 |
∟ ∟ ∟ tag | 是 | string | 固定为textarea |
∟ ∟ ∟ name | 是 | string | 填写框名称 |
∟ ∟ ∟ size | 是 | string | 填写内容字数上限 |
∟ ∟ ∟ placeholder | 是 | string | 默认提示文案 |
∟ ∟ ∟ type | 是 | string | 枚举值:input_box==输入框;prompt_box==提示框 |
∟ ∟ ∟ prompt | 是 | string | 提示内容 |
∟ ∟ footer | 是 | array | 弹窗底部按钮 |
∟ ∟ ∟ confirm | 是 | string | 确认按钮的内容 |
∟ ∟ ∟ ∟ type | 是 | string | 文本类型,支持 plain 和 markdown 两种类型 |
∟ ∟ ∟ ∟ content | 是 | string | 文本内容 |
∟ ∟ ∟ cancel | 是 | string | 取消按钮的内容 |
∟ ∟ ∟ ∟ type | 是 | string | 文本类型,支持 plain 和 markdown 两种类型 |
∟ ∟ ∟ ∟ content | 是 | string | 文本内容 |
∟ width | 否 | string | 宽度(默认宽度:default ;填满父容器:fill ;自定义宽度:[100,∞)px ) |
∟ icon | 否 | object | 前缀图标配置 |
∟ ∟ tag | 是 | string | 图标类型,目前仅支持 custom_icon |
∟ ∟ storage_key | 否 | string | 图片存储key |
∟ ∟ token | 否 | string | 图片token |
∟ disabled_tips | 否 | object | 禁用提示 |
∟ ∟ type | 是 | string | 文本类型,固定为 plain |
∟ ∟ content | 是 | string | 文本内容 |
∟ hover_tips | 否 | object | 悬停提示 |
∟ ∟ type | 是 | string | 文本类型,固定为 plain |
∟ ∟ content | 是 | string | 文本内容 |
∟ margin | 否 | string | 外边距(支持自定义上、下、左、右外边距,可修改任意一边/多边,值的取值范围为 [-99,99]px。超出取值范围时,将按最大支持范围展示),例如 20px 20px 20px 20px |
图片示例
JSON结构
json
{
"button": {
"tag": "button",
"text": {
"content": "文本内容",
"type": "枚举值:plain==纯文本;markdown==markdown;"
},
"style": "枚举值:normal==主要按钮;secondary==辅助按钮;warn==警示按钮;disable==禁用按钮",
"link": {
"android_url": "",
"ios_url": "",
"pc_url": "",
"url": "默认链路url"
},
"key": "用于回传标识,会将该字段值回传(回传必须)",
"required": false,
"modal": {
"tag": "modal",
"header": "标题",
"content": [
{
"tag": "textarea",
"name": "交互标识",
"size": "内容大小",
"placeholder": "默认提示文案",
"type": "枚举值:input_box==输入框;prompt_box==提示框",
"prompt": "提示内容"
}
],
"footer": {
"confirm": {
"content": "确认",
"type": "枚举值:plain==纯文本;markdown==markdown;"
},
"cancel": {
"content": "取消",
"type": "枚举值:plain==纯文本;markdown==markdown;"
}
}
},
"width": "100px",
"icon": {
"tag": "custom_icon",
"storage_key": "图片存储key"
},
"disabled_tips": {
"type": "plain",
"content": "禁用提示"
},
"hover_tips": {
"type": "plain",
"content": "悬停提示"
},
"margin": "20px 20px 20px 20px"
}
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56