import { ComponentType } from 'react' import { StandardProps, CommonEventFunction } from './common' import { StyleProp, ViewStyle } from 'react-native' interface ButtonProps extends StandardProps { /** 按钮的大小 * @supported weapp, alipay, swan, tt, qq, jd, h5, rn, harmony_hybrid * @default default */ size?: keyof ButtonProps.Size /** 按钮的样式类型 * @supported weapp, alipay, swan, tt, qq, jd, h5, rn, harmony, harmony_hybrid * @default default */ type?: keyof ButtonProps.Type /** 按钮是否镂空,背景色透明 * @supported weapp, alipay, swan, qq, jd, h5, rn, harmony, harmony_hybrid * @default false */ plain?: boolean /** 是否禁用 * @supported weapp, alipay, swan, tt, qq, jd, h5, rn, harmony, harmony_hybrid * @default false */ disabled?: boolean /** 名称前是否带 loading 图标 * @supported weapp, alipay, swan, tt, qq, jd, h5, rn, harmony, harmony_hybrid * @default false */ loading?: boolean /** 用于 `
` 组件,点击分别会触发 `` 组件的 submit/reset 事件 * @supported weapp, alipay, swan, tt, qq, jd, harmony */ formType?: keyof ButtonProps.FormType /** 微信开放能力 * @supported weapp, alipay, swan, tt, qq, jd */ openType?: ButtonProps.OpenType /** 指定按下去的样式类。当 `hover-class="none"` 时,没有点击态效果 * @default button-hover * @supported weapp, alipay, swan, tt, qq, jd, h5, rn, harmony_hybrid * @rn 支持 hoverStyle 属性,但框架未支持 hoverClass */ hoverClass?: string /** 由于 RN 不支持 hoverClass,故 RN 端的 Button 组件实现了 `hoverStyle`属性,写法和 style 类似,只不过 `hoverStyle` 的样式是指定按下去的样式。 * @default none * @supported rn */ hoverStyle?: StyleProp /** 指定是否阻止本节点的祖先节点出现点击态 * @default false * @supported weapp, alipay, swan, tt, qq, jd */ hoverStopPropagation?: boolean /** 按住后多久出现点击态,单位毫秒 * @default 20 * @supported weapp, alipay, swan, tt, qq, jd, h5, rn, harmony_hybrid */ hoverStartTime?: number /** 手指松开后点击态保留时间,单位毫秒 * @default 70 * @supported weapp, alipay, swan, tt, qq, jd, h5, rn, harmony_hybrid */ hoverStayTime?: number /** 指定返回用户信息的语言,zh_CN 简体中文,zh_TW 繁体中文,en 英文。 * * 生效时机: `open-type="getUserInfo"` * @supported weapp, qq, jd */ lang?: keyof ButtonProps.Lang /** 会话来源 * * 生效时机:`open-type="contact"` * @supported weapp, swan */ sessionFrom?: string /** 会话内消息卡片标题 * * 生效时机:`open-type="contact"` * @default 当前标题 * @supported weapp, swan */ sendMessageTitle?: string /** 会话内消息卡片点击跳转小程序路径 * * 生效时机:`open-type="contact"` * @default 当前标题 * @supported weapp, swan */ sendMessagePath?: string /** 会话内消息卡片图片 * * 生效时机:`open-type="contact"` * @default 截图 * @supported weapp, swan */ sendMessageImg?: string /** 打开 APP 时,向 APP 传递的参数 * * 生效时机:`open-type="launchApp"` * @supported weapp, qq, jd */ appParameter?: string /** 支付宝小程序 scope * * 生效时机:`open-type="getAuthorize"` * @supported alipay */ scope?: 'userInfo' | 'phoneNumber' /** 显示会话内消息卡片 * * 生效时机:`open-type="contact"` * @supported weapp, swan * @default false */ showMessageCard?: boolean /** 生活号 id,必须是当前小程序同主体且已关联的生活号,open-type="lifestyle" 时有效。 * @supported alipay, qq */ publicId?: string /** 发送订阅类模板消息所用的模板库标题 ID ,可通过 getTemplateLibraryList 获取 * 当参数类型为 Array 时,可传递 1~3 个模板库标题 ID * @supported swan */ templateId?: string | Array /** 发送订阅类模板消息时所使用的唯一标识符,内容由开发者自定义,用来标识订阅场景 * 注意:同一用户在同一 subscribe-id 下的多次授权不累积下发权限,只能下发一条。若要订阅多条,需要不同 subscribe-id * @supported swan */ subscribeId?: string /** 群聊 id * @qq 打开群资料卡时,传递的群号 * @tt 通过创建聊天群、查询群信息获取 * @supported qq, tt */ groupId?: string /** 打开频道页面时,传递的频道号 * @supported qq */ guildId?: string /** 分享类型集合,请参考下面share-type有效值说明。share-type后续将不再维护,请更新为share-mode * @supported qq * @default 27 */ shareType?: string /** 分享类型集合,请参考下面share-mode有效值说明 * @supported qq * @default ['qq', 'qzone'] */ shareMode?: string /** 无障碍访问,(属性)元素的额外描述 * @supported qq */ ariaLabel?: string /** 添加好友时,对方的 openid * @supported qq */ openId?: string /** 发送对象的 FriendInfo * @supported qq */ shareMessageFriendInfo?: string /** 转发标题,不传则默认使用当前小程序的昵称。 FriendInfo * @supported qq */ shareMessageTitle?: string /** 转发显示图片的链接,可以是网络图片路径(仅 QQ CDN 域名路径)或本地图片文件路径或相对代码包根目录的图片文件路径。显示图片长宽比是 5:4FriendInfo * @supported qq */ shareMessageImg?: string /** 跳转抖音号个人页,只支持小程序绑定的品牌号、员工号、合作号 * @supported tt */ dataAwemeId?: string /** * 是否开启半屏模式 * @supported tt */ dataIsHalfPage?: boolean /** 用户点击该按钮时,会返回获取到的用户信息,回调的detail数据与 Taro.getUserInfo 返回的一致 * * 生效时机: `open-type="getUserInfo"` * @supported weapp, alipay, swan, qq, jd */ onGetUserInfo?: CommonEventFunction /** 支付宝获取会员基础信息授权回调 * * 生效时机:`open-type="getAuthorize"` * @supported alipay */ onGetAuthorize?: CommonEventFunction /** 客服消息回调 * * 生效时机:`open-type="contact"` * @supported weapp, swan, qq */ onContact?: CommonEventFunction /** 获取用户手机号回调 * * 生效时机:`open-type="getPhoneNumber"` * @supported weapp, alipay, swan, tt, jd */ onGetPhoneNumber?: CommonEventFunction /** * 手机号实时验证回调,`open-type="getRealtimePhoneNumber"` 时有效 * @supported weapp */ onGetRealTimePhoneNumber?: CommonEventFunction /** 当使用开放能力时,发生错误的回调 * * 生效时机:`open-type="launchApp"` * @supported weapp, alipay, qq, jd */ onError?: CommonEventFunction /** 在打开授权设置页后回调 * * 生效时机:`open-type="openSetting"` * @supported weapp, swan, tt, qq, jd */ onOpenSetting?: CommonEventFunction /** 打开 APP 成功的回调 * * 生效时机:`open-type="launchApp"` * @supported weapp, qq */ onLaunchApp?: CommonEventFunction /** 获取用户头像回调 * * 生效时机:`open-type="chooseAvatar"` * @supported weapp */ onChooseAvatar?: CommonEventFunction /** * 用户同意隐私协议事件回调,`open-type="agreePrivacyAuthorization"`时有效 * @supported weapp */ onAgreePrivacyAuthorization?: CommonEventFunction /** 点击。 * 说明: 每点击一次会触发一次事件,建议自行使用代码防止重复点击,可以使用 js 防抖和节流实现。 * @supported alipay */ onTap?: CommonEventFunction /** 当 open-type 为 lifestyle 时有效。 * 当点击按钮时触发。 * event.detail = { followStatus },followStatus 合法值有 1、2、3,其中 1 表示已关注。2 表示用户不允许关注。3 表示发生未知错误; * 已知问题:基础库 1.0,当用户在点击按钮前已关注生活号,event.detail.followStatus 的值为 true。 * @supported alipay */ onFollowLifestyle?: CommonEventFunction<{ followStatus: 1 | 2 | 3 | true }> /** 用户点击该按钮时,调起用户编辑收货地址原生界面,并在编辑完成后返回用户选择的地址,从返回参数的 detail 中获取,和 swan.chooseAddress 一样的。和 open-type 搭配使用,使用时机:open-type="chooseAddress" * @supported swan */ onChooseAddress?: CommonEventFunction /** 用户点击该按钮时,选择用户的发票抬头,和 swan.chooseInvoiceTitle 一样的。和 open-type 搭配使用,使用时机:open-type="chooseInvoiceTitle" * @supported swan */ onChooseInvoiceTitle?: CommonEventFunction /** 登录回调,和 open-type 搭配使用,使用时机:open-type="login"。可以通过返回参数的 detail 判断是否登录成功,当 errMsg 为'login:ok'时即为成功。如想获取登录凭证请使用 swan.getLoginCode * @supported swan */ onLogin?: CommonEventFunction /** 订阅消息授权回调,和 open-type 搭配使用,使用时机:open-type="subscribe" * @supported swan */ onSubscribe?: CommonEventFunction /** 添加好友的回调 * @supported qq */ onAddFriend?: CommonEventFunction /** 添加群应用的回调。errCode 错误码:41004(当前用户非管理员或群主,无权操作),41005(超过可添加群应用的群数量) * @supported qq */ onAddGroupApp?: CommonEventFunction /** 监听跳转抖音号个人页的回调 * * 生效时机:`open-type="openAwemeUserProfile"` * @supported tt */ onOpenAwemeUserProfile?: CommonEventFunction /** * 加群后触发 * @supported tt */ onJoinGroup?: CommonEventFunction<{ errMsg: string; errNo: number }> } declare namespace ButtonProps { /** size 的合法值 */ interface Size { /** 默认大小 */ default /** 小尺寸 */ mini } /** type 的合法值 */ interface Type { /** 绿色 */ primary /** 白色 */ default /** 红色 */ warn } /** form-type 的合法值 */ interface FormType { /** 提交表单 */ submit /** 重置表单 */ reset } /** open-type 的合法值 */ type OpenType = | keyof openTypeKeys['weapp'] | keyof openTypeKeys['alipay'] | keyof openTypeKeys['qq'] | keyof openTypeKeys['tt'] /** open-type 的合法值 */ interface openTypeKeys { weapp: { /** 打开客服会话,如果用户在会话中点击消息卡片后返回小程序,可以从回调中获得具体信息 * @see https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/customer-message/customer-message.html */ contact /** 触发用户转发,使用前建议先阅读使用指引 * @see https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/share.html#%E4%BD%BF%E7%94%A8%E6%8C%87%E5%BC%95 */ share /** 获取用户手机号,可以从回调中获取到用户信息 * @see https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/getPhoneNumber.html */ getPhoneNumber /** * 手机号实时验证,向用户申请,并在用户同意后,快速填写和实时验证手机号。(*小程序插件中不能使用*) * @see https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/getRealtimePhoneNumber.html */ getRealtimePhoneNumber /** 获取用户信息,可以从回调中获取到用户信息 */ getUserInfo /** 打开APP,可以通过 app-parameter 属性设定向APP传的参数 * @see https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/launchApp.html */ launchApp /** 打开授权设置页 */ openSetting /** 打开“意见反馈”页面,用户可提交反馈内容并上传日志,开发者可以登录小程序管理后台后进入左侧菜单“客服反馈”页面获取到反馈内容 */ feedback /** 获取用户头像,可以从回调中获得具体信息 */ chooseAvatar /** * 用户同意隐私协议按钮。可通过 bindagreeprivacyauthorization 监听用户同意隐私协议事件 */ agreePrivacyAuthorization /** * 从基础库 2.32.3 版本起,隐私同意按钮支持与手机号快速验证组件耦合使用,调用方式为: * * ) * })} * * * * * * * * * * ) * } * } * ``` * @example_vue * ```html * * * * ``` * @see https://developers.weixin.qq.com/miniprogram/dev/component/button.html */ declare const Button: ComponentType export { Button, ButtonProps }