CheckboxgroupCheckbox
Used by CheckboxgroupElement
to display checkboxes.
Options
Find below the list of options that can use to configure CheckboxgroupCheckbox
component. Options can be passed to the component via props.
item
- Type:
object|string|number
- Required:
true
<CheckboxgroupCheckbox item="Vue.js" ... />
<CheckboxgroupCheckbox :item="{ name: 'Vue.js', description: 'A Javascript framework' }" ... />
The checkbox option.
value
- Type:
string|number|boolean
- Required:
true
<CheckboxgroupCheckbox item="Vue.js" ... />
<CheckboxgroupCheckbox :item="{ name: 'Vue.js', description: 'A Javascript framework' }" ... />
The checkbox option value.
items
- Type:
object|array
- Required:
true
index
- Type:
number
- Required:
true
standalone
- Type:
boolean
attrs
- Type:
object
- Default:
{}
<CheckboxgroupCheckboxElement :attrs="{ autofocus: true }" ... />
Assigns HTML attributes to the container / input field.
Properties
All the data
, computed
and inject
properties of the component.
checked
- Type:
boolean
- Group:
computed
Whether the checkbox is checked.
id
- Type:
boolean
- Group:
computed
The id
attribute of the input.
name
- Type:
boolean
- Group:
computed
The name
attribute of the input.
isDisabled
- Type:
boolean
- Group:
computed
Whether the checkbox should be disabled.
Size
- Type:
string
- Group:
inject
The size of the component.
View
- Type:
string
- Group:
computed
The name of the resolved view for the component. This one should be used to determine the component's view in class functions.
template
- Type:
object
- Group:
computed
The component's template.
classes
- Type:
object
- Group:
computed
The component's classes.
theme
- Type:
object
- Group:
inject
The global theme object, which contains all the default templates and classes.
form$
- Type:
Vueform
- Group:
inject
The root form's component.
el$
- Type:
VueformElement
- Group:
inject
The parent element's component.
Views
The CheckboxgroupCheckbox
component is used by CheckboxgroupElement
as a child component and inherits the view
from it.
default
<CheckboxgroupElement
name="checkboxgroup"
:items="['Vue.js', 'React', 'AngularJS']"
/>
tabs
<CheckboxgroupElement
name="checkboxgroup"
:items="['Vue.js', 'React', 'AngularJS']"
view="tabs"
/>
blocks
<CheckboxgroupElement
name="checkboxgroup"
:items="[
{ value: 'Vue.js', label: 'Vue.js', description: 'Vue.js framework' },
{ value: 'React', label: 'React', description: 'React framework' },
{ value: 'AngularJS', label: 'AngularJS', description: 'AngularJS framework' }
]"
view="blocks"
/>