em-data-pay
v1.0.7
Published
a pay component for em-data
Downloads
1
Readme
em-pay
a pay component for em-data.
传参说明
| 属性 | 是否必传 | 备注 | | -------- | -----: | :----: | | orderCode | 是 | 外部传进来的订单号 | | webTitle | 是 | 产品名称 | | BASEURL | 否 | 接口域名,默认null | | titleText | 否 | 提示框的标题,默认'选择支付方式' | | tips | 否 | 提示框的小文字,默认null | | payText | 否 | 支付按钮的文字,默认'立即支付' | | payMethod | 否 | 当前选中的支付方式,默认'wechat',可选值'ali' |
方法
显示支付弹窗组件
this.$refs[ref].show(config)
隐藏支付弹窗组件
this.$refs[ref].hidden()
使用方法
# 组件内部使用
html:
<button @click='goPay'>去支付</button>
<em-data-pay ref='emData' />
js:
import emDataPay from 'em-data-pay'
components: {
emDataPay
},
methods:{
goPay() {
let config = {
orderCode: '8888',
BASEURL: 'https://xxx.com',
webTitle: 'xxx产品', //
tips: 'xxx'
}
this.$refs.emData.show(config)
}
}
# main.js 全局安装
import emDataPay from 'em-data-pay'
Vue.use(emDataPay)
然后在其他.vue文件里面,直接使用组件 <em-data-pay /> 即可
# 直接引用打包后的 em-data-pay.js
这种方式就不需要webpack这类的构建工具,跟jquery的方式差不多,可以直接页面引用,使用方法示例如下:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
</head>
<body>
<div id="app">
<em-data-pay ref="emData"></em-data-pay>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.6.11/vue.min.js"></script>
<script src="./dist/em-data-pay.js"></script>
<script>
new Vue({
el: '#app',
methods: {
}
})
</script>
</body>
</html>