Package Exports

v-money

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (v-money) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

v-money Mask for Vue.js

The Mask Money

Features

Lightweight (<2KB gzipped)
Dependency free
Mobile support
Component or Directive flavors
Accept copy/paste
Editable

For other types of mask, use vue-the-mask

Usage

A. Globally

import Vue from 'vue'
import money from 'v-money'

// register directive v-money and component <money>
Vue.use(money, {precision: 4})

B. Use as component: https://jsfiddle.net/auom8st8/

<template>
  <div>
    <money v-model="price" v-bind="money"></money> {{price}}
  </div>
</template>

<script>
  import {Money} from 'v-money'

  export default {
    components: {Money},

    data () {
      return {
        price: 123.45,
        money: {
          decimal: ',',
          thousands: '.',
          prefix: 'R$ ',
          suffix: ' #',
          precision: 2,
          masked: false
        }
      }
    }
  }
</script>

C. Use as directive: https://jsfiddle.net/nj3cLoum/2/

Must use vmodel.lazy to bind works properly.

<template>
  <div>
    <input v-model.lazy="price" v-money="money" /> {{price}}
  </div>
</template>

<script>
  import {VMoney} from 'v-money'

  export default {
    data () {
      return {
        price: 123.45,
        money: {
          decimal: ',',
          thousands: '.',
          prefix: 'R$ ',
          suffix: ' #',
          precision: 2,
          masked: false /* doesn't work with directive */
        }
      }
    },

    directives: {money: VMoney}
  }
</script>

Properties

property	Required	Type	Default	Description
precision	true	Number	2	How many decimal places
decimal	false	String	"."	Decimal separator
thousands	false	String	","	Thousands separator
prefix	false	String	""	Currency symbol followed by a Space, like "R$ "
suffix	false	String	""	Percentage for example: " %"
masked	false	Boolean	false	If the component output should include the mask or not

v-money