Documentation
Documentation Hub

Rounded:none

The checkbox component can have different radius factors. Here is an example of a rounded:none checkbox.

Default props of all <BaseCheckbox> can be set in your <app>/app.config.ts.
Show code
vue

Rounded:sm

The checkbox component can have different radius factors. Here is an example of a rounded:sm checkbox.

Show code
vue

Rounded:md

The checkbox component can have different radius factors. Here is an example of a rounded:md checkbox.

Show code
vue

Rounded:lg

The checkbox component can have different radius factors. Here is an example of a curved checkbox.

Show code
vue

Rounded:full

The checkbox component can have different radius factors. Here is an example of a full checkbox.

Show code
vue

Disabled

The checkbox component can show a disabled state. Use the disabled prop to make a checkbox disabled.

Show code
vue

Value:custom

Use true-value/false-value to create custom behavior

Show code
vue

Value:multiple

By default, the checkbox value has only two states: true and false. To use checkbox to select multiple options, define the v-model to an array.

Show code
vue

#<BaseCheckbox>

•Model

v-model
Show example
vue

•Properties

classes
Optional CSS classes to apply to the wrapper, label, and input elements.
Show example
vue
disabled
Whether the checkbox is disabled.
Show example
vue
error
An error message to display below the checkbox label.
Show example
vue
false-value
The value to set when the checkbox is unchecked.
Show example
vue
id
The form input identifier.
Show example
vue
indeterminate
Whether the checkbox is in indeterminate state.
Show example
vue
label
The label to display for the checkbox.
Show example
vue
true-value
The value to set when the checkbox is checked.
Show example
vue
value
Defines the value of the checkbox when it's checked.
Show example
vue

•Properties (with app.config)

color
The color of the checkbox.
Show example
vue
rounded
The radius of the checkbox.

@since

2.0.0

Show example
vue

•Slots

#default
Show example
vue