Vue wrapper for Chargebee.js Components
npm install @chargebee/chargebee-js-vue-wrapperbash
npm install @chargebee/chargebee-js-vue-wrapper
`Usage
Chargebee Components requires you to initialize chargebee js with and publishableKey> Wondering where to obtain your publishable API key? Refer here
In your
:
`html
...
`$3
In your vue component
js
`$3
>Note: If vue version is 3.2 or less, please add the following line to your Vue application bootstrap
>
> Reference documentation
js
`
$3
In your vue component
js
`Components and APIs
#### Card Component (docs)
Props | Description | Datatype
------|-------------|---------
| CSS Class name for the container element | String
fonts | An array of font faces or links | Fonts
classes | Set of CSS classnames that get substituted for various events | Classes
locale | Language code | Locale
styles | Set of style customizations | Styles
placeholder | Set of placeholders for the card fields | Placeholder
ref | Vue reference(ref) for card component | Vue ref##### Events (docs)
Props | Description | Arguments
------|-------------|---------
@ready | Triggers when component is mounted and ready | Field
@change | Triggers for every state change | Field State
@focus | Triggers when component is focused | Field State
@blur | Triggers when component is blurred | Field State#### Field Components (docs)
* CardNumber
* CardExpiry
* CardCVV
Props | Description | Datatype
------|-------------|---------
class | CSS Classname for container element | String
styles | Styles for inidividual field | Styles
placeholder | Placeholder for the field | String##### Event Props (docs)
Props | Description | Arguments
------|-------------|---------
@ready | Triggers when component is mounted and ready | Field
@change | Triggers for every state change | Field State
@focus | Triggers when component is focused | Field State
@blur` | Triggers when component is blurred | Field State