Skip to main content
You are viewing Pre-Alpha documentation.
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

createNumberField API

API reference for the createNumberField composable.

Functions

createNumberField

(options?: NumberFieldOptions) => NumberFieldContext

Options

min

number | undefined

Minimum value.

Default: -Infinity

max

number | undefined

Maximum value.

Default: Infinity

step

number | undefined

Step increment for Arrow keys.

Default: 1

leap

number | undefined

Large step for PageUp/PageDown.

Default: step * 10

wrap

boolean | undefined

Circular wrapping (max+step → min).

Default: false

value

Ref<number | null, number | null> | undefined

Value source — defaults to ref(null).

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

disabled

MaybeRefOrGetter<boolean> | undefined

Disabled state.

readonly

MaybeRefOrGetter<boolean> | undefined

Readonly state.

id

import("/home/runner/work/0/0/packages/0/src/types/index").ID | undefined

Unique identifier.

label

string | undefined

Display label.

name

string | undefined

Form field name.

rules

(string | import("/home/runner/work/0/0/packages/0/src/composables/index").FormValidationRule | import("/home/runner/work/0/0/packages/0/src/composables/index").StandardSchemaV1)[] | undefined

Validation rules.

error

MaybeRefOrGetter<boolean> | undefined

Manual error state override — forces invalid.

errorMessages

MaybeRefOrGetter<import("/home/runner/work/0/0/packages/0/src/types/index").MaybeArray<string> | undefined>

Manual error messages — merged with rule-based errors.

Properties

value

Ref<number | null, number | null>

The numeric value (null when empty).

display

Readonly<Ref<string, string>>

Formatted display string (empty for null).

canIncrement

Readonly<Ref<boolean, boolean>>

Whether the value can be incremented.

canDecrement

Readonly<Ref<boolean, boolean>>

Whether the value can be decremented.

numeric

NumericContext

The underlying numeric context.

input

InputContext<number | null>

The underlying input context.

Methods

increment

(multiplier?: number) => void

Increment value by step * multiplier.

decrement

(multiplier?: number) => void

Decrement value by step * multiplier.

floor

() => void

Set value to min.

ceil

() => void

Set value to max.

formatValue

(value: number) => string

Format a number using Intl.NumberFormat.

parse

(text: string) => number | null

Parse locale-formatted text to a number or null.

commit

() => void

Snap and optionally clamp the current value.

Was this page helpful?

© 2016-1970 Vuetify, LLC
Ctrl+/