A Vue Plugin for Paystack payment gateway.
npm install vue vue-paystack --save
<!-- Vue -->
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<!-- Vue-Paystack -->
<script src="https://unpkg.com/vue-paystack/dist/paystack.min.js"></script><template>
<paystack
:amount="amount"
:email="email"
:paystackkey="paystackkey"
:reference="reference"
:callback="callback"
:close="close"
:embed="false"
>
<i class="fas fa-money-bill-alt"></i>
Make Payment
</paystack>
</template>
<script type="text/javascript">
import paystack from 'vue-paystack';
export default {
components: {
paystack
},
data(){
return{
paystackkey: "pk_test_xxxxxxxxxxxxxxxxxxxxxxx", //paystack public key
email: "[email protected]", // Customer email
amount: 1000000 // in kobo
}
},
computed: {
reference(){
let text = "";
let possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
for( let i=0; i < 10; i++ )
text += possible.charAt(Math.floor(Math.random() * possible.length));
return text;
}
},
methods: {
callback: function(response){
console.log(response)
},
close: function(){
console.log("Payment closed")
}
}
}
</script>new Vue({
el: '#app',
components:{
'paystack': VuePaystack.default
},
computed: {
reference(){
let text = "";
let possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
for( let i=0; i < 10; i++ )
text += possible.charAt(Math.floor(Math.random() * possible.length));
return text;
}
},
methods: {
callback: function(response){
console.log(response)
},
close: function(){
console.log("Payment closed")
}
},
data: {
paystackkey: "pk_test_xxxxxxxxxxxxxxxxxxxxxx", //paystack public key
email: "[email protected]", // Customer email
amount: 1000000, // in kobo
}
});Please checkout Paystack Documentation for other available options you can add to the
REMEMBER TO CHANGE THE KEY WHEN DEPLOYING ON A LIVE/PRODUCTION SYSTEM
- Fork it!
- Create your feature branch:
git checkout -b feature-name - Commit your changes:
git commit -am 'Some commit message' - Push to the branch:
git push origin feature-name - Submit a pull request 😉😉
Why not star the github repo? I'd love the attention! Why not share the link for this repository on Twitter or Any Social Media? Spread the word!
Don't forget to follow me on twitter!
Thanks! Ayeni Olusegun.
This project is licensed under the MIT License - see the LICENSE.md file for details