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

Checkbox API

API reference for the Checkbox components.

Explore these related pages for additional context and usage patterns.

PageCategory
CheckboxForms
createGroupSelection
GroupProviders

Checkbox.Root

Props

id

any

Unique identifier (auto-generated if not provided)

Default: useId()

label

string | undefined

Optional display label (passed through to slot)

value

V | undefined

Value associated with this checkbox (used in group mode and form submission)

name

string | undefined

Form field name - triggers auto hidden input when provided

form

string | undefined

Associate with form by ID

disabled

MaybeRefOrGetter<boolean> | undefined

Disables this checkbox

Default: false

indeterminate

MaybeRefOrGetter<boolean> | undefined

Sets the indeterminate state

Default: false

namespace

string | undefined

Namespace for context provision to children (Indicator, HiddenInput)

Default: "v0:checkbox:root"

groupNamespace

string | undefined

Namespace for connecting to parent Checkbox.Group

Default: "v0:checkbox:group"

ariaLabelledby

string | undefined

ID of element that labels this checkbox

ariaDescribedby

string | undefined

ID of element that describes this checkbox

ariaInvalid

boolean | undefined

Whether the checkbox has an invalid value

modelValue

boolean | undefined

Events

update:model-value

[value: boolean]

Slots

default

CheckboxRootSlotProps<V>

Checkbox.Group

Props

namespace

string | undefined

Namespace for dependency injection

Default: "v0:checkbox:group"

disabled

boolean | undefined

Disables the entire checkbox group

Default: false

enroll

boolean | undefined

Auto-select non-disabled items on registration

Default: false

mandatory

boolean | "force" | undefined

Controls mandatory checkbox behavior: - false (default): No mandatory enforcement - true: Prevents deselecting the last selected item - `force`: Automatically selects the first non-disabled item on registration

Default: false

label

string | undefined

Accessible name for the group

ariaLabelledby

string | undefined

ID of element that labels this group

ariaDescribedby

string | undefined

ID of element that describes this group

modelValue

T | T[] | undefined

Events

update:model-value

[value: T | T[]]

Slots

default

CheckboxGroupSlotProps

Checkbox.HiddenInput

Props

namespace

string | undefined

Namespace for context injection from parent Checkbox.Root

Default: "v0:checkbox:root"

name

string | undefined

Form field name (defaults to context value)

value

string | undefined

Submitted value when checked (defaults to context value or 'on')

form

string | undefined

Associate with form by ID (defaults to context value)

Checkbox.Indicator

Props

namespace

string | undefined

Namespace for context injection from parent Checkbox.Root

Default: "v0:checkbox:root"

Slots

default

CheckboxIndicatorSlotProps

Checkbox.SelectAll

Props

label

string | undefined

Optional display label (passed through to slot and aria-label)

disabled

boolean | undefined

Disables this checkbox

namespace

string | undefined

Namespace for context provision to children (Indicator)

Default: "v0:checkbox:root"

groupNamespace

string | undefined

Namespace for connecting to parent Checkbox.Group

Default: "v0:checkbox:group"

ariaLabelledby

string | undefined

ID of element that labels this checkbox

ariaDescribedby

string | undefined

ID of element that describes this checkbox

Slots

default

CheckboxSelectAllSlotProps
Was this page helpful?

© 2016-1970 Vuetify, LLC
Ctrl+/