Mono for Vue 2.x

This is a Vue Package that helps you integrate Mono - https://withmono.com/ easily"

Install

Vue

Install the npm package:

npm install --save vue-mono
# OR
yarn add vue-mono

Add the Vue plugin in your main.js and pass your connect public key:

import Vue from 'vue'
import Mono from 'vue-mono'

Vue.use(Mono, { publicKey: 'YOUR CONNECT PUBLIC KEY' })

Nuxt

Install the npm package:

npm install --save vue-mono
# OR
yarn add vue-mono

Create a mono.js file in your plugins folder and add the Vue plugin:

// plugins/mono.js

import Vue from 'vue'
import Mono from 'vue-mono'

Vue.use(Mono, { publicKey: 'YOUR CONNECT PUBLIC KEY' })

Go to your nuxt.config.js and add it to your plugin section

/*
** Plugins to load before mounting the App
** https://nuxtjs.org/guide/plugins
*/
............
plugins: [{src: '~/plugins/mono', ssr: false},],
...........

Usage

Mono can be launched using $launchMono() method, see example below

<template>
  <div class="btn-wrapper">
    <button type="button" @click="launchMono">Launch Mono</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      amount: 200
    }
  },
  methods: {
    launchMono() {
      const options = {
        onSuccess: function (response) {
          alert(JSON.stringify(response));
					/**
						response : { "code": "code_xyz" }
						you can send this code back to your server to get this
						authenticated account and start making requests.
					*/
        },

        onClose: function () {
          alert('user closed the widget.')
        }
      };
      this.$launchMono(options)
    }
  }
}
</script>

Please checkout Mono Documentation for more explanation

Follow on Twitter @mrflamez_

License

This project is licensed under the MIT License - see the LICENSE.md file for details