Skip to content
This repository was archived by the owner on Mar 21, 2020. It is now read-only.

Commit 84fd323

Browse files
authored
Merge pull request #55 from suryaadtmaja/nuxtjs/update-readme
how to use in nuxt js, update readme
2 parents c1b0c84 + 91a446c commit 84fd323

File tree

1 file changed

+41
-0
lines changed

1 file changed

+41
-0
lines changed

README.md

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -253,6 +253,47 @@ export default {
253253
</script>
254254
```
255255

256+
## Usage with Nuxt JS
257+
Simply include Vue and `vue-paypal-checkout` into your html file (using unpkg cdn or npm)
258+
259+
``` html
260+
<script src="https://unpkg.com/vue"></script>
261+
<script src="https://unpkg.com/vue-paypal-checkout@2.0.0/dist/vue-paypal-checkout.min.js"></script>
262+
```
263+
264+
By including vue-paypal-checkout in a script tag, it will automagically register the component into Nuxt js
265+
266+
create a plugins called paypal.js
267+
``` html
268+
import Vue from 'vue'
269+
import PayPal from 'vue-paypal-checkout'
270+
Vue.component('paypal-checkout', PayPal)
271+
```
272+
273+
274+
in nuxt-config don't forget to add it on plugins, and make sure you disable SSR
275+
``` html
276+
plugins: [
277+
{ src: '~/plugins/paypal.js', ssr: false }
278+
],
279+
</script>
280+
```
281+
282+
283+
and use it like this
284+
``` html
285+
<no-ssr>
286+
<paypal-checkout
287+
env="sandbox"
288+
amount="10000"
289+
currency="IDR"
290+
locale="fr_FR"
291+
:client="paypal"
292+
:invoice-number="'201705051001'">
293+
</paypal-checkout>
294+
</no-ssr>
295+
```
296+
256297
#### Changing Locale (v2.3.3+)
257298
`paypal-checkout` allows changing the locale of the button via a `locale` parameter. There's a `locale` prop you can use to accomplish the same:
258299

0 commit comments

Comments
 (0)