flutterwave-vue3
# Flutterwave vue3 library The current official Flutterwave vue library is incompatible with vue3 and nuxt 3, why i created this fully typed with typescript version, ## installation you can add flutterwave-vue3 to your project using: ```bash yarn add flutterwave-vue3 //or npm i flutterwave-vue3 ``` ## Add to project (Core Vue3) import the installed flutterwave-vue3 in your main.js file ```javascript import Flutterwave from 'flutterwave-vue3' ``` then use the .use() method to add Flutterwave to plugin lists ```javascript createApp(App).use(Flutterwave).mount('#app') ``` ## Add to project (nuxt3) create a file called ravePlugin in your plugins folder, then go ahead to define your plugin according to nuxt3 doc, sample code below: ```javascript import { defineNuxtPlugin } from "#app"; import Flutterwave from "flutterwave-vue3"; export default defineNuxtPlugin((nuxtApp) => { nuxtApp.vueApp.use(Flutterwave, {}); }); ``` ## Open payment modal you can now upen payment modal using the `useFlutterwave` composable, ```javascript import {useFlutterwave} from "flutterwave-vue3" //this will launch Fluterwave payment modal useFlutterwave({ amount: 4000,//amount callback(data: any): void { // TODO: handle callbacks }, country: "NG", currency: "NGN", customer: {email: '[email protected]', name: 'adewale', phone_number: '+2347086967055'}, customizations: {description: "Pay with yourCompanyname", logo: "", title: "YourCompany"}, meta: { user_id: 1, token: "jdjdjdjdjd" }, onclose(): void { }, payment_options: "card", public_key: "FLWPUBK_TEST-8b0ef2eef5b71b2922996d16a2dc0292-X", redirect_url: undefined, tx_ref: "tx_ref_herer_h92hjyj3" }) ``` ## DISCLAIMER This is not the official Vue3 Library for flutterwave, it was created out of necessity, star the repo if you find it useful