Vue Input Number

Input field component to display a formatted number value. It is meant to be used with Vue 3.

This is rewrite based on vue-numeric written in TypeScript.

Installation

Install via NPM

$ npm install @robin-rossow/vue-input-number --save

Use globally

import VueInputNumberPlugin from '@robin-rossow/vue-input-number'

import { createApp } from 'vue'
import App from './App.vue'

createApp(App)
    .use(VueInputNumberPlugin)
    .mount('#app')

Load in component

import { VueInputNumber } from '@robin-rossow/vue-input-number'

Usage

Load in template

<VueInputNumber v-model="ourModel"/>

Props

| Props | Required | Type | Default | |------------------------|----------|---------------------------------------|-------------------------| | v-model | ✅ | string | number | undefined | - | | outputType | ❌ | 'Number' | 'String' | 'Number' | | min | ❌ | number | Number.MIN_SAFE_INTEGER | | max | ❌ | number | Number.MAX_SAFE_INTEGER | | precision | ❌ | number | 0 | | thousandSeparator | ❌ | string | undefined | ',' | | decimalSeparator | ❌ | string | undefined | ',' | | currency | ❌ | string | '' | | currencySymbolPosition | ❌ | 'prefix' |' suffix' | 'prefix' | | emptyValue | ❌ | number | '' | '' |

License

vue-number-input is open-sourced software licensed under the MIT license