原型:
<buttonsize="[default | mini]"type="[primary | default | warn]"plain="[Boolean]"disabled="[Boolean]"loading="[Boolean]"form-type="[submit | reset]"open-type="[contact | share | getUserInfo | getPhoneNumber | launchApp | openSetting | feedback]"hover-class="[String]"hover-stop-propagation="[Boolean]"hover-start-time="[Number]"hover-stay-time="[Number]"lang="[zh_CN | zh_TW | en]"bindgetuserinfo="[Handler]"session-from="[String]"send-message-title="[String]"send-message-path="[String]"send-message-img="[String]"show-message-card="[Boolean]"bindcontact="[Handler]"bindgetphonenumber="[Handler]"app-parameter="[String]"binderror="[Handler]"bindopensetting="[Handler]">
</button>
属性:
名称 | 是否必须 | 类型 | 默认值 | 说明 |
size | 否 | [default | mini] | default | 按钮大小 |
type | 否 | [primary | default | warn] | default | 按钮的样式类型 |
plain | 否 | [Boolean] | false | 按钮是否镂空,背景色透明 |
disabled | 否 | [Boolean] | false | 是否禁用 |
loading | 否 | [Boolean] | false | 名称前是否带 loading 图标 |
form-type | 否 | [submit | reset] | false | 用于 <form/> 组件,点击分别会触发 <form/> 组件的 submit/reset 事件 |
open-type | 否 | [contact | share | getUserInfo | getPhoneNumber | launchApp | openSetting | feedback] | 微信开放能力(各参数值说明见后表) | |
hover-class | 否 | [String] | button-hover类 样式:{background-color: rgba(0, 0, 0, 0.1); opacity: 0.7;} | 指定按钮按下去的样式类。当 hover-class="none" 时,没有点击态效果 |
hover-stop-propagation | 否 | [Boolean] | false | 指定是否阻止本节点的祖先节点出现点击态 |
hover-start-time | 否 | [Number] | 20 | 按住后多久出现点击态,单位毫秒 |
hover-stay-time | 否 | [Number] | 70 | 手指松开后点击态保留时间,单位毫秒 |
lang | 否 | [en | zh_CN | zh_TW] | en | 返回用户信息的语言,生效条件:open-type="getUserInfo" |
bindgetuserinfo | 否 | [Handler] | 用户点击该按钮时,会返回获取到的用户信息,生效条件:open-type="getUserInfo" | |
session-from | 否 | [String] | 会话来源,生效条件:open-type="contact" | |
send-message-title | 否 | [String] | 当前标题 | 会话内消息卡片标题,生效条件:open-type="contact" |
send-message-path | 否 | [String] | 当前分享路径 | 会话内消息卡片点击跳转小程序路径,生效条件:open-type="contact" |
send-message-img | 否 | [String] | 截图 | 会话内消息卡片图片,生效条件:open-type="contact" |
show-message-card | 否 | [Boolean] | false | 显示会话内消息卡片,生效条件:open-type="contact" |
bindcontact | 否 | [Handler] | 客服消息回调,生效条件:open-type="contact" | |
bindgetphonenumber | 否 | [Handler] | 获取用户手机号回调,生效条件:open-type="getPhoneNumber" | |
app-parameter | 否 | [String] | 打开 APP 时,向 APP 传递的参数,生效条件:open-type="launchApp" | |
binderror | 否 | [Handler] | 当使用开放能力时,发生错误的回调,生效条件:open-type="launchApp" | |
bindopensetting | 否 | [Handler] | 在打开授权设置页后回调,生效条件:open-type="openSetting" |
open-type 有效值:
值 | 说明 |
contact | 打开客服会话,如果用户在会话中点击消息卡片后返回小程序,可以从 bindcontact 回调中获得具体信息 |
share | 触发用户转发 |
getUserInfo | 获取用户信息,可以从bindgetuserinfo回调中获取到用户信息 |
getPhoneNumber | 获取用户手机号,可以从bindgetphonenumber回调中获取到用户信息 |
launchApp | 打开APP,可以通过app-parameter属性设定向APP传的参数 |
openSetting | 打开授权设置页 |
feedback | 打开“意见反馈”页面,用户可提交反馈内容并上传日志,开发者可以登录小程序管理后台后进入左侧菜单“客服反馈”页面获取到反馈内容 |
未完,待续...
更多专业前端知识,请上 【猿2048】www.mk2048.com