2.0.2 • Published 5 years ago

@yitzhakandrade/v-currency-field v2.0.2

Weekly downloads
1
License
MIT
Repository
github
Last release
5 years ago

Currency Mask for Vuetify v2

This is a fork from https://github.com/phiny1/v-currency-field adapted for Vuetify v2.

Features

  • All features from v-money as v-text-field of vuetify v2.

Usage

Globally

import Vue from 'vue'
import currency from 'v-currency-field'

import 'v-currency-field/dist/index.css'

Vue.use(currency)

Example

<template>
  <div>
    <v-currency-field label="Value" v-bind="currency_config" :error-messages="errors.price" v-model="price"></v-currency-field>
  </div>
</template>

<script>
  export default {
    data () {
      return {
        errors: {},
        price: 123.45,
        currency_config: {
          decimal: ',',
          thousands: '.',
          prefix: 'R$ ',
          suffix: ' #',
          precision: 2,
          masked: false,
          allowBlank: false,
          min: Number.MIN_SAFE_INTEGER,
          max: Number.MAX_SAFE_INTEGER
        }
      }
    }
  }
</script>

Properties

All v-money properties

propertyRequiredTypeDefaultDescription
precisiontrueNumber2How many decimal places
decimalfalseString"."Decimal separator
thousandsfalseString","Thousands separator
prefixfalseString""Currency symbol followed by a Space, like "R$ "
suffixfalseString""Percentage for example: " %"
maskedfalseBooleanfalseIf the component output should include the mask or not
allowBlankfalseBooleanfalseIf the field can start blank and be cleared out by user
minfalseNumberNumber.MIN_SAFE_INTEGERThe min value allowed
maxfalseNumberNumber.MAX_SAFE_INTEGERThe max value allowed

And all vuetify properties

propertyRequiredTypeObservation
appendOuterIconfalseString
appendOuterIconCbfalseFunctionWorking but deprecated
@click:append-outerfalseFunctionNot Working
autofocusfalseBoolean
browserAutocompletefalseStringNot Tested
clearablefalseBooleanNot Working Event
clearIconfalseString
clearIconCbfalseNumberWorking but deprecated
@click:clearfalseNumberNot Working
colorfalseString
filledfalseBoolean
flatfalseBoolean
fullWidthfalseBoolean
labelfalseString
outlinedfalseBoolean
prependInnerIconfalseString
prependInnerIconCbfalseFunctionWorking but deprecated
@click:prepend-innerfalseFunctionNot Working
reversefalseBoolean
singleLinefalseBoolean
solofalseBoolean
soloInvertedfalseBoolean
error-messagesfalse[]
disabledfalseBoolean
readonlyfalseBoolean
darkfalseBoolean
heightfalseString
hintfalseString
lightfalseBoolean
background-colorfalseString

References