paylode-vue
v1.0.3
Published
Paylode VueJS Component for Vue .
Downloads
10
Maintainers
Readme
SeerBit Checkout Wrapper for VueJS
Requirements
This module was built and tested using VueJS 2.6.7
Get Started
A simple way to add Paylode to your VueJS application
Install
npm install --save paylode-vuejs
yarn add paylode-vuejs
Usage
<template>
<div class="container">
<seerbit
:amount="amount"
:email="email"
:publicKey="publicKey"
:reference="reference"
:onCallback="onCallback"
:onCloseCheckout="onCloseCheckout"
:autoCheckout="false"
>
Checkout with SeerBit
</seerbit>
</div>
</template>
<script type="text/javascript">
import seerbit from 'seerbit-vuejs';
export default {
components: {
seerbit
},
data(){
return{
publicKey: "SBTESTPUBK_XeKUDcFUGw1kmEfanjgp0iLviCseMX2N",
fullName: "John Doe",
email: "[email protected]",
amount: "200000.00"
}
},
computed: {
reference(){
return Date.now().toString();
}
},
methods: {
onCallback: function(response){
console.log(response)
},
onCloseCheckout: function(){
console.log("checkout closed")
}
},
}
</script>
<style>
.container {
display: flex;
text-align: center;
justify-content: center;
align-items: center;
height: 100vh;
}
.SeerBitCheckoutButton{
background-color: #263a81;
color: #ffffff;
border: 0 transparent;
width: 250px;
height: 50px;
font-weight: 800;
cursor: pointer;
}
</style>
Please checkout Seerbit Documentation for other available options you can add to the tag
License
MIT © seerbit