Need help with vue-stripe-elements?
Click the “chat” button below for chat support from the developer who created it, or find similar developers for support.

About the developer

fromAtoB
493 Stars 126 Forks MIT License 44 Commits 45 Opened issues

Description

A Vue 2 component collection for StripeElements

Services available

!
?

Need anything else?

Contributors list

Vue Stripe Elements

A Vue 2 component collection for stripe elements.

Usage example

Install package:

$ npm i vue-stripe-elements-plus --save

Add Stripe.js library to index.html:


Build a Vue component using the Card element:



Multiple elements

Even if it is recommended to use the unified Card element, single elements for each field are supported. The following example shows a possible use in a credit card component:



Supported Stripe Elements Functions

|Function|Reference| |---|---| | createToken() | https://stripe.com/docs/stripe-js/reference#stripe-create-token | | createSource() | https://stripe.com/docs/stripe-js/reference#stripe-create-source | | retrieveSource() | https://stripe.com/docs/stripe-js/reference#stripe-retrieve-source | | paymentRequest() | https://stripe.com/docs/stripe-js/reference#stripe-payment-request | | redirectToCheckout() | https://stripe.com/docs/stripe-js/reference#stripe-redirect-to-checkout | | retrievePaymentIntent() | https://stripe.com/docs/stripe-js/reference#stripe-retrieve-payment-intent | | handleCardPayment() | https://stripe.com/docs/stripe-js/reference#stripe-handle-card-payment | | handleCardSetup() | https://stripe.com/docs/stripe-js/reference#stripe-handle-card-setup | | handleCardAction() | https://stripe.com/docs/stripe-js/reference#stripe-handle-card-action | | confirmPaymentIntent() | https://stripe.com/docs/stripe-js/reference#stripe-confirm-payment-intent | | createPaymentMethod() | https://stripe.com/docs/stripe-js/reference#stripe-create-payment-method |

We use cookies. If you continue to browse the site, you agree to the use of cookies. For more information on our use of cookies please see our Privacy Policy.