前端接口

1. API

使用方法 PMdropin.API。

API	描述	详情
create	示例化一个内置组件	参阅create
mount	将实例化组件挂载到div标签	参阅mount
on	监听事件	参阅on
emit	触发事件	参阅emit

1.1 create

用于初始化组件，使用方法 PMdropin.create(ComponentName, Options)。

ComponentName详解

ComponentName	字段类型	描述
googlepay	string	GooglePay组件

Options详解

Options	是否必填	字段类型	描述	默认值
clientKey	Y	String	客户端公钥	-
sessionKey	Y	String	安全访问令牌	-
sandbox	N	Boolean	沙盒环境	false
payButtonStyle	N	Object	按钮样式	'{buttonRadius: "12",buttonColor: "default",buttonType: "plain",buttonLocale: "en",width: "240px",height: "40px"}'

1.2 mount

用于挂载初始化组件实例，使用方法PMdropin.mount(Tag)。

Tag详解

Tag	描述
id	需要挂载的id元素值，如 PMdropin.mount('#googlepay-frame')
class	需要挂载的class元素值，如 PMdropin.mount('.googlepay-frame')

1.3 on

用于监听组件内置响应事件，使用方法PMdropin.on(Event, CallbackFunction)。

Event详解

Tag	描述	返回值
ready	组件加载完成时触发	null
payButtonClick	GooglePay按钮被点击时触发	null

1.4 emit

用于调用组件内置方法，使用方法PMdropin.emit(Event, Params)。

Event	Params	描述
canMakePayment	-	获取本次支付token
switchTheme	string	切换主题
setDisabled	Boolean	设置组件可用状态
setPayButtonStyle	Object	设置按钮样式

1.4.1 emit.canMakePayment

检查当前组件状态是否具备发起支付条件，如果校验通过则返回卡标识。

canMakePayment Response：

Code码	描述
APPLY_SUCCESS	成功获取 paymentToken
UNKNOWN_ISSUE	异常信息

1.4.2 emit.setDisabled

• 设置组件可用状态
• 类型 Boolean
• 默认：false

// 按钮不可用状态
PMdropin.emit('setDisabled', true)

// 按钮可用状态
PMdropin.emit('setDisabled', false)

1.4.3 emit.setPayButtonStyle

• 设置按钮样式
• 类型： Object
• 默认：

{
  buttonRadius: "12", // 设置googlepay按钮边框弧度 String
  buttonColor: 'default', // 设置按钮颜色  "default"/"white"/ "black"
  buttonType: 'plain',
  buttonLocale: 'en',
  width:"240px",
  height:"40px",
}

2. 内部字段说明

字段	默认值	类型	枚举值	功能说明
width	"240px"	String	/	设置googlepay按钮宽
height	"40px"	String	/	设置googlepay按钮高
buttonRadius	"12"	String	/	设置googlepay按钮边框弧度 String
buttonColor	'default'	String	'default'/'white'/ 'black'	设置按钮颜色
buttonType	'plain'	String	"plain","buy","book","checkout","donate","order","pay","subscribe"	设置按钮类型 同GooglePay官方。自定义按钮预览demo
buttonLocale	'en'	String	'en'/'ja'/'zh'/... 国际语种编码	设置按钮上文案的多语言，同GooglePay官方，需指定类型才支持，如"checkout"、"donate"等

3. 颜色展示

入参	效果预览
default
white
black

4. buttonType展示

入参	效果预览
"plain"
"buy"
"book"
"checkout"
"donate"
"order"
"pay"
"subscribe"

5. buttonLocale展示

入参	效果预览	说明
"ja"		Japanese
"bg"		Bulgarian