Format Currency In Text Box

Install & Download:

# Yarn
$ yarn add vue-currency-directive
# NPM
$ npm i vue-currency-directive --save

Description:

A simple and easy-to-use Vue.js directive to format currency strings in text boxes.

How to use it:

1. Import the module.

import Vue from 'vue';
import vueCurrencyDirective from 'vue-currency-directive';

2. Register the directive.

Vue.directive('currency', vueCurrencyDirective);

// or
export default {
  ...
  data(){
    amount: {
      value: '', 
      formatted: '' // Better to be empty
    }, 
  },
  directives: {
    currency: vueCurrencyDirective
  },
  ...
}

3. Basic usage.

<template>
  <input v-currency="amount.value">
  <input v-currency="foo.value">
  <input v-currency="bar.value">
</template>

Preview:

Changelog:

v1.5.5 (11/04/2022)

• Update