# vue-money

> Money format plugin

Latest version **0.4.1** (published 2019-02-14) · MIT license · 0 weekly downloads

## Install

```sh
npm install vue-money
pnpm add vue-money
yarn add vue-money
bun add vue-money
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support; pre 1.0.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 0.4.1 |
| Published | 2019-02-14 |
| First published | 2017-10-31 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 33 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 0 |
| Author | apexjcl |
| Maintainers | apxjcl |

## Links

- npm: https://www.npmjs.com/package/vue-money
- Repository: https://github.com/apexJCL/vue-money
- npm.io page: https://npm.io/package/vue-money

## Recent versions

- 0.4.1 (latest) — 2019-02-14
- 0.4.0 — 2019-02-07
- 0.3.3 — 2019-01-25
- 0.3.2 — 2019-01-25
- 0.3.1 — 2019-01-25
- 0.3.0 — 2019-01-25
- 0.2.0 — 2019-01-25
- 0.1.0 — 2018-06-29
- 0.0.51 — 2017-11-07
- 0.0.5 — 2017-11-07
- 0.0.42 — 2017-11-03
- 0.0.41 — 2017-10-31
- 0.0.4 — 2017-10-31
- 0.0.3 — 2017-10-31
- 0.0.2 — 2017-10-31
- … 1 more at https://npm.io/package/vue-money/versions

## README

# Vue Money

**Disclaimer:** I did this as my first vue plugin to allow have elements that autoformat any
given number to a comma separated values. It may lack some stuff, or have serious bugs.

## How to use

`yarn add vue-money`

Then:

```javascript
import Vue from 'vue'
import Money from 'vue-money'

Vue.use(Money, config)
```

Where `config` can be: 
```javascript
const config = {
    places: 2,
    symbol: '$',
    decimalSeparator: '.',
    thousandsSeparator: ',',
    format: '/%money%/',
    directive: 'money-format',
    global: 'moneyFormat', // Will be deprecated for next release
    filter: 'money',
    componentTag: 'money-input',
    globalDirective: 'money'
}
```

This will make the plugin available via the directive `v-money-format` or the global method
`this.$moneyFormat`.

## Usage:

### Global 

You can access the format utilities through `vm.$money` (or the `globalDirective` value set in the config options).

This will let you use two methods:

#### `format(value)`

Receives the number to format

##### `removeFormat(formattedString, defaultValue)`

Receives the String to remove format and a default value in case the string can't be evaluated.

### Input component

Now the plugin comes with an input component that can be used as:

```vue
<template>
    <money-input v-model=""/>
</template>
```

This will format the value `@blur` and emit the numeric value

> You can change the name of the component through the `componentTag` config parameter.


### Directive mode:

```html
<p v-money-format="value"></p>

<!-- or -->

<p v-money-format="value">Price is %money%</p>
```

This would result in the following:

```html
<p>$123.45</p>

<!-- or -->

<p>Price is $123.45</p>
```

---
_Source: https://npm.io/package/vue-money · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._