[Feature Request] Currency Input

[mczarnobai]

Problem to solve

I was not successful when trying to use a currency mask for the v-text-field component. I found no way to allow only numbers with 2 decimal places

Proposed solution

v-text-field
prefix="$"
type="decimal"
precision="2"

[va-b]

My solution, may be useful for you

<v-text-field
		:label="label" :readonly="readonly" :disabled="disabled" :rules="rules"
		v-model.trim="innerValue"
		@focus="focus"
		@blur="isInFocus = false"
		@click:clear="innerValue = ''"
/>

@Component
export default class MyFloatInput extends Vue
{
	@Prop({required: true}) value!: number|null;
	@Prop({required: true, type: String}) label!: string;
	@Prop({default: false, type: Boolean}) readonly!: boolean;
	@Prop({default: false, type: Boolean}) disabled!: boolean;
	@Prop({default: () => [], type: Array}) rules!: Function[];

	private isInFocus: boolean = false;
	private innerText: string = '';

	private focus()
	{
		this.innerText = !!this.value ? this.value.toString() : '';
		this.isInFocus = true;
	}

	private blur()
	{
		this.isInFocus = false;
		this.innerText = !!this.value ? this.value.toString() : '';
	}

	private get innerValue(): string
	{
		return this.isInFocus
			? this.innerText
			: this.$l[this.value ?? ''];
	}
            private format(v): string
            {
               return !isNaN(+v) 
               ? new Intl.NumberFormat(this.localeCode, {minimumFractionDigits: 2, maximumFractionDigits: 2}).format(+v)
               : ''
           }


	private set innerValue(v: string)
	{
		if(v === '')
		{
			this.innerText = '';
			this.$emit('input', null);
		}
		if(/^\-?\d+(\.|\,)?\d*$/.test(v))
		{
			this.innerText = v.replace(",", ".");
			this.$emit('input', Number(Number(this.innerText).toFixed(2)));
		}
		else
		{
			this.innerText = v.replace(/([^ \d\.\,\-\s]+)|((\.|\,|\-){2,})/g, '');
		}
	}
};

[johnleider]

Thank you for the Feature Request and interest in improving Vuetify. After careful consideration the team has decided that this is not functionality that we are looking to implement at this time.

If you have any additional questions, please reach out to us in our Discord community.