Field number ​

The field is used to enter numerical values.

• Keyword number.
• WhatWG Спецификация.

Params ​

autofocus Optional ​

• Type: boolean | 'true' | 'false'

If this parameter is passed, when setting this field, control will be automatically transferred to it.

suffix Optional ​

• Type: string

If the data attribute is set, the text label will be displayed at the end of the field.

step Optional ​

• Type: number | string

This field has a mechanism to increase or decrease the entered number by 1. To change this parameter the step attribute must be set.

pretty Optional ​

• Type StringModify | StringModify Used to change the display of a field. These rules are accepted only after field became inactive.

placeholder Optional ​

• Type: string

The string value of the prompt before entering data.

Also, all parameters common to all FormField. Information about them can be found on this page.

Value ​

This field works with numeric values.

Specification ​

• The field is available when using Tab and Shift + Tab.
• Lock cancels Tab navigation.
• The value can be manipulated via an additional controller.
• Blocking a field changes the style of number.
• Validation error changes number style.
• The field allows you to enter numbers and symbols from +-.,.

Examples ​

There are no additional-required parameters for this field, so we need to specify only type and name. The pretty function is in the ts tab:

<form-field name = "value" type="number"/>

<form-field name = "value" type="number"/>

import {FormField} from "jenesius-vue-form";

function prettyFn(value) {
	if (!value) return '0';
	return `- ${value} -`;
}

import {FormField} from "jenesius-vue-form";

function prettyFn(value) {
	if (!value) return '0';
	return `- ${value} -`;
}

Default field:

In locked state:

Поле не прошло валидацию:

Field using suffix attribute:

Field with step value changed:

Changing the final display of a field with the pretty attribute:

The current state of the form:

{}

{}