Skip to main content
Vuetify0 is now in alpha!
Vuetify0 Logo
Theme
Mode
Palettes
Accessibility
Vuetify One
Sign in to Vuetify One

Access premium tools across the Vuetify ecosystem — Bin, Play, Studio, and more.

Not a subscriber? See what's included

NumberField API

API reference for the NumberField components.

Explore these related pages for additional context and usage patterns.

PageCategory
Number FieldForms
createNumberFieldForms
SliderForms
InputForms

NumberField.Root

Props

id

any

Unique identifier (auto-generated if not provided)

Default: useId()

label

string | undefined

Optional display label

name

string | undefined

Form field name

form

string | undefined

Associate with form by ID

required

boolean | undefined

Whether this field is required

disabled

MaybeRefOrGetter<boolean> | undefined

Disables this field

Default: false

readonly

MaybeRefOrGetter<boolean> | undefined

Makes this field readonly

min

number | undefined

Minimum value

max

number | undefined

Maximum value

step

number | undefined

Step increment (default: 1)

leap

number | undefined

Leap increment for PageUp/PageDown

wrap

boolean | undefined

Wrap around at boundaries

locale

string | undefined

BCP 47 locale tag (default: 'en-US')

format

Intl.NumberFormatOptions | undefined

Intl.NumberFormat options

clamp

boolean | undefined

Whether commit() clamps to min/max (default: true)

rules

any[] | undefined

Validation rules

Default: []

validateOn

any

When to trigger validation

Default: "blur"

error

boolean | undefined

Manual error state override — forces invalid

Default: false

errorMessages

any

Manual error messages — merged with rule-based errors

spinDelay

number | undefined

Delay in ms before spin-on-hold starts (default: 400)

Default: 400

spinRate

number | undefined

Interval in ms for repeated spin (default: 60)

Default: 60

wheel

boolean | undefined

Whether mouse wheel adjusts value (default: false)

Default: false

namespace

string | undefined

Namespace for context provision

Default: "v0:number-field:root"

modelValue

number | null | undefined

Default: null

Events

update:model-value

[value: number | null]

Slots

default

NumberFieldRootSlotProps

NumberField.Control

Props

namespace

string | undefined

Namespace for connecting to parent NumberField.Root

Default: "v0:number-field:root"

Slots

default

NumberFieldControlSlotProps

NumberField.Decrement

Props

namespace

string | undefined

Namespace for connecting to parent NumberField.Root

Default: "v0:number-field:root"

Slots

default

NumberFieldDecrementSlotProps

NumberField.Description

Props

id

string | undefined

Unique identifier (auto-generated if not provided)

Default: useId()

namespace

string | undefined

Namespace for connecting to parent NumberField.Root

Default: "v0:number-field:root"

Slots

default

NumberFieldDescriptionSlotProps

NumberField.Error

Props

id

string | undefined

Unique identifier (auto-generated if not provided)

Default: useId()

namespace

string | undefined

Namespace for connecting to parent NumberField.Root

Default: "v0:number-field:root"

Slots

default

NumberFieldErrorSlotProps

NumberField.Increment

Props

namespace

string | undefined

Namespace for connecting to parent NumberField.Root

Default: "v0:number-field:root"

Slots

default

NumberFieldIncrementSlotProps

NumberField.Scrub

Props

namespace

string | undefined

Namespace for connecting to parent NumberField.Root

Default: "v0:number-field:root"

sensitivity

number | undefined

Pixels of movement per step (default: 1)

Default: 1

Slots

default

NumberFieldScrubSlotProps
Was this page helpful?

Ctrl+/