Form
Radio
Pick exactly one option. Use RadioGroupComponent for a list of options, or RadioButtonComponent for custom layouts.
import { RadioGroupComponent, RadioButtonComponent } from '@/MigsLab/shared'
Radio group
Selected: md
<RadioGroupComponent v-model="size" :options="sizeOptions" />
<RadioGroupComponent v-model="size" :options="sizeOptions" direction="horizontal" />Individual radio buttons
<RadioButtonComponent v-model="plan" value="free" name="plan">Free</RadioButtonComponent>
<RadioButtonComponent v-model="plan" value="pro" name="plan">Pro</RadioButtonComponent>API
RadioGroupComponent props
| Name | Type | Default | Description |
|---|---|---|---|
v-model | string | number | undefined | Selected value. |
options | SelectOption[] | — | Options as { label, value, disabled? }. |
direction | 'vertical' | 'horizontal' | 'vertical' | Stack or line up the options. |
name | string | auto id | Native name shared by the radios. |
disabled | boolean | false | Disable every option. |
RadioButtonComponent props
| Name | Type | Default | Description |
|---|---|---|---|
v-model | string | number | undefined | Selected value shared by the group. |
value | string | number | — | Value this radio represents. |
name | string | undefined | Native name; give related radios the same name. |
disabled | boolean | false | Disable this radio. |