Поле number ​

Поле используется для ввода численных значений.

• Ключевое слово number.
• WhatWG Спецификация.

Параметры ​

autofocus Необязательный ​

• Тип boolean | 'true' | 'false'

Если данный параметр передаётся, при установке данного поля, на него будет автоматически передано управление.

suffix Необязательный ​

• Тип string

Если данные атрибут установлен, текстовая метка будет отображаться в конце поля.

step Необязательный ​

• Тип number | string Данное поле имеет механизм увеличения или уменьшения введённого числа на 1. Для изменения этого параметра необходимо задать атрибут step.

pretty Необязательный ​

• Тип StringModify | StringModify Используется для изменения отображения поля. Данные правила принимаются только после того, как поле стало не активным.

placeholder Необязательный ​

• Тип string

Строковое значение подсказки перед вводом данных.

Так же все параметры, общие для всех FormField. Информацию о них можно посмотреть на этой странице.

Значение ​

Данное поле работает с числовым значениями.

Спецификация ​

• Поле доступно при использовании Tab и Shift + Tab.
• Блокировка отменяет навигацию через Tab.
• Работа со значением может осуществляться через дополнительный контроллер.
• Блокировка поля изменяет стилистику number.
• Ошибка валидации изменяет стилистику number.
• Поле позволяет вводить цифры и символы из +-.,.

Пример ​

Для данного поля нет дополнительных обязательных параметров, по этому нам необходимо указать лишь type и name. Функция pretty находится во вкладке ts:

<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} -`;
}

Поле по умолчанию:

В заблокированном состоянии:

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

Поле с использованием аттрибута suffix:

Поле с изменённым значение step:

Изменение конечного отображения поля при помощи аттрибута pretty:

Текущее состояние формы:

{}

{}