在作百度小程序的时候,设计师们一定要对按钮的尺寸以及对应属性名称要熟悉,因为按钮的大小需要根据整体设计来进行调整,同时也要符合用户的视觉美观要求,以及系统的要求标准,如下百度小程序button按钮属性一览内容,希望能给大家一定的帮助。
百度小程序button按钮属性一览
开发者工具 button 组件 open-type 不支持设置 contact ,请到真机上调试。
解释:按钮,设计文档参考按钮 。
Web 态说明:由于浏览器的限制,在 Web 态内不支持获取联系人、打开授权设置页等功能。具体支持情况详见属性说明。
属性说明
属性名 | 类型 | 默认值 | 必填 | 说明 | 最低支持版本 | Web 态说明 |
---|---|---|---|---|---|---|
String |
default |
否 |
大小 |
- | - | |
String |
default |
否 |
类型 |
- | - | |
plain |
Boolean |
false |
否 |
按钮是否镂空,背景色透明 |
- | - |
String |
buttonclick |
否 |
用于 |
- | - | |
String |
否 |
百度 App 开放能力,比如分享、获取用户信息等等 |
- | - | ||
hover-class |
String |
button-hover |
否 |
点击态。指定按钮按下去的样式类。当 |
- | - |
hover-stop-propagation |
Boolean |
false |
否 |
指定是否阻止本节点的祖先节点出现点击态 |
- | - |
hover-start-time |
Number |
20 |
否 |
按住后多久出现点击态(单位:毫秒) |
- | - |
hover-stay-time |
Number |
70 |
否 |
手指松开后点击态保留时间(单位:毫秒) |
- | - |
disabled |
Boolean |
false |
否 |
是否禁用 |
- | - |
loading |
Boolean |
false |
否 |
名称前是否带有 loading 图标 |
- | - |
bindgetphonenumber |
EventHandle |
否 |
获取用户手机号回调。和 open-type 搭配使用, 使用时机: |
1.12.14 |
暂不支持 |
|
bindgetuserinfo |
EventHandle |
否 |
用户点击该按钮时,会返回获取到的用户信息,可以从返回参数的 detail 中获取到的值。当 errMsg 为 |
- |
暂不支持 |
|
bindopensetting |
EventHandle |
否 |
在打开授权设置页后回调,使用时机: |
- |
暂不支持 |
|
bindcontact |
EventHandle |
否 |
客服消息回调,使用时机: |
- |
暂不支持 |
|
bindchooseaddress |
EventHandle |
否 |
用户点击该按钮时,调起用户编辑收货地址原生界面,并在编辑完成后返回用户选择的地址,从返回参数的 detail 中获取,和 swan.chooseAddress 一样的。和 open-type 搭配使用,使用时机: |
3.160.3 |
暂不支持 |
|
bindchooseinvoicetitle |
EventHandle |
否 |
用户点击该按钮时,选择用户的发票抬头,和 swan.chooseInvoiceTitle 一样的。和 open-type 搭配使用,使用时机: |
3.160.3 |
暂不支持 |
|
bindlogin |
EventHandle |
否 |
登录回调,和 open-type 搭配使用,使用时机: |
3.230.1 |
- | |
template-id |
String/Array.<string> |
否(open-type 为 subscribe 时必填) |
发送订阅类模板消息所用的模板库标题 ID ,可通过 getTemplateLibraryList 获取 |
3.270.1 |
暂不支持 |
|
subscribe-id |
String |
否(open-type 为 subscribe 时必填) |
发送订阅类模板消息时所使用的唯一标识符,内容由开发者自定义,用来标识订阅场景 |
3.270.1 |
暂不支持 |
|
bindsubscribe |
EventHandle |
否 |
订阅消息授权回调,和 open-type 搭配使用,使用时机: |
3.270.1 |
暂不支持 |
size 有效值
值 | 说明 |
---|---|
default | 默认大小 |
mini | 小尺寸 |
type 有效值
值 | 说明 |
---|---|
primary | 蓝色 |
default | 白色 |
warn | 红色 |
form-type 有效值
值 | 说明 |
---|---|
buttonclick | 普通按钮点击 |
submit | 提交表单 |
reset | 重置表单 |
open-type 有效值
值 | 说明 | Web 态说明 |
---|---|---|
share | 触发用户分享,使用前建议先阅读 swan.onShareAppMessage | - |
getUserInfo | 获取用户信息,可以从 bindgetuserinfo 回调中获取到用户信息,参考用户数据的签名验证和加解密对用户数据进行处理 | 出于安全性考虑,暂不支持 |
getPhoneNumber | 获取用户手机号,可以从 bindgetphonenumber 回调中获取到用户信息: detail.errMsg 值为 "getPhoneNumber:ok" 时代表用户信息获取成功;detail.errMsg 值为 "getPhoneNumber:fail auth deny" 时代表用户信息获取失败。参考用户数据的签名验证和加解密对用户数据进行处理获得用户手机号。 用户手机号信息解密后数据示例: {"mobile":"15000000000"} 1. 非个人开发者可申请; 2. 审核通过后,进入小程序首页,在左侧导航栏单击“设置 -> 开发设置”。下拉页面,在“获取用户手机号权限申请”中单击“申请开通” |
出于安全性考虑,暂不支持 |
openSetting | 打开授权设置页 | 暂不支持 |
chooseAddress | 选择用户收货地址,可以从 bindchooseaddress 回调中获取到用户选择的地址信息 | 出于安全性考虑,暂不支持 |
chooseInvoiceTitle | 选择用户发票抬头,可以从 bindchooseinvoicetitle 回调中获取到用户选择发票抬头信息 | 出于安全性考虑,暂不支持 |
contact | 打开客服会话,如果用户在会话中点击消息卡片后返回小程序,可以从 bindcontact 回调中获得具体信息 | 暂不支持 |
login | 登录,可以从 bindlogin 回调中确认是否登录成功 | - |
subscribe | 订阅类模板消息,需要用户授权才可发送,订阅消息详细说明请参考订阅消息接入 | 暂不支持 |