Just add the same v-model
to multiple Checkboxes, and set a native-value
.
Checkbox
Select a single or grouped options
# Grouped (Array)
Selection: [ "Flint" ]
# Sizes
# Types
You have to wrap them on a Field.
Selection: []
# API
Checkbox
Name | Description | Type | Values | Default |
---|---|---|---|---|
v-model | Binding value | Any | — | false |
native-value | Same as native value | Any | — | — |
indeterminate | Same as native indeterminate | Boolean | — | — |
true-value | Overrides the returned value when it's checked | Any | — | true |
false-value | Overrides the returned value when it's not checked | Any | — | false |
disabled | Same as native disabled | Boolean | — | false |
required | Same as native required | Boolean | — | false |
name | Same as native name | String | — | — |
size | Size of the control, optional | String | is-small , is-medium , is-large | — |
type | Type (color) of the control, optional | String | is-white , is-black , is-light ,
is-dark , is-primary , is-info , is-success ,
is-warning , is-danger ,
and any other colors you've set in the $colors list on Sass | — |
Checkbox Button
Name | Description | Type | Values | Default |
---|---|---|---|---|
v-model | Binding value | Any | — | — |
native-value | Same as native value | Any | — | — |
type | Type (color) of the button when checked | String | is-white , is-black , is-light ,
is-dark , is-primary , is-info , is-success ,
is-warning , is-danger ,
and any other colors you've set in the $colors list on Sass | is-primary |
disabled | Same as native disabled | Boolean | — | false |
name | Same as native name | String | — | — |
size | Size of the button, optional | String | is-small , is-medium , is-large | — |
expanded | Checkbox button will be expanded (full-width) | Boolean | — | false |
# Variables
You can use these variables to customize this component.
Name | Default |
---|---|
$checkbox-active-background-color | $primary |
$checkbox-background-color | transparent |
$checkbox-border-color | $grey |
$checkbox-border-radius | $radius |
$checkbox-border-width | 2px |
$checkbox-checkmark-color | $primary-invert |
$checkbox-size | 1.25em |
This page is open source. Noticed a typo or something's unclear?