Plugin - v-currency A currency formatter for Vue
2018, Mar 14
v-currency
A plugin for formatting currency in Vue.js
Usage
Vue.use(Currency, {
"type": "USD",
"thousandSeparator": true,
});
In order to use it in your components:
export default {
name: 'Sample',
data () {
return {
moneys: [
100500.945, 15043.5, 9909, 210, 44.30, -24, 'tq1'
]
}
},
methods: {
getMoneys(i) {
return this.$helpers.currency(this.moneys[i]);
},
},
To change currency on the fly
onChange(e){
this.$helpers.changeCurrency(e.target.value);
this.$forceUpdate();
}
Supported formats
- USD
- CAD
- EUR
- GBP
- JPY
- DEU
To create a custom format you can add rules to the components
"YOUR_CUSTOM_CURRENCY": {
"symbol": "$_",
"thousandSeperator": 0,
"decimalSeperator": 0,
"negativePattern": 2
},
Build Setup
# install dependencies
npm install
# serve with hot reload at localhost:8080
npm run dev
# build for production with minification
npm run build
# build for production and view the bundle analyzer report
npm run build --report
For a detailed explanation on how things work, check out the guide and docs for vue-loader.