The individual radio inputs in <b-form-radio-group>
can be specified via the options prop, or via manual placement of the <b-form-radio>
sub component. When using manually placed <b-form-radio>
components within a <b-form-radio-group>
, they will inherit most props and the v-model from the <b-form-radio-group>
By default <b-form-radio-group>
generates inline radio inputs, while <b-form-radio>
generates stacked radios. Set the prop stacked
on <b-form-radio-group>
to make the radios appear one over the other, or when using radios not in a group, set the inline
prop on b-form-radio
to true to render them inline
<div>
<b-form-radio name="radio-size" size="sm">Small</b-form-radio>
<b-form-radio name="radio-size">Default</b-form-radio>
<b-form-radio name="radio-size" size="lg">Large</b-form-radio>
</div>
Use the size
prop to control the size of the radio. The default size is medium. Supported size values are sm
(small) and lg
(large).
Render radios with the look of buttons by setting the prop buttons
to true
on <b-form-radio-group>
. Set the button variant by setting the button-variant
prop to one of the standard Bootstrap button variants (see <b-button>
for supported variants). The default button-variant
is secondary
.