Radioedit
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.
TIP
Please also refer to the QOptionGroup on other possibilities for creating groups of Radios.
Installation
chevron_leftchevron_right
// quasar.conf.js
return {
framework: {
// NOT needed if using auto-import feature:
components: [
'QRadio'
]
}
}
Usage
Standard
Dense
Coloring
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
With QOptionGroup
TIP
You can also use QOptionGroup, which simplifies the usage when you have groups of radios, like in example below.
With QItem
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.
QRadio API
Related