The QRadio component is another basic element for user input. You can use this to supply a way for the user to pick an option from multiple choices.
Please also refer to the QOptionGroup on other possibilities for creating groups of Radios.
With custom icons v1.18+
In the second row in the example below, the property
keep-color is being used to retain the passed in color when the radio button is not in a toggled state.
Dark and disable
Label on left-side
Apart from the standard sizes below, you can define your own through the
size property (last one is a custom size).
You can also use QOptionGroup, which simplifies the usage when you have groups of radios, like in example below.
In the example below, we are rendering a
<label> tag (notice
tag="label") so the QRadio will respond to clicks on QItems to change toggle state.
Native form submit v1.9+
When dealing with a native form which has an
action and a
method (eg. when using Quasar with ASP.NET controllers), you need to specify the
name property on QRadio, otherwise formData will not contain it (if it should) - all value are converted to string (native behaviour, so do not use Object values):