I was trying to set the value of a radio button as a boolean and store this value, but when I did, it didn't seem to work.
<v-radio-group v-model="test" class="pl-2">
<v-radio
label="Yes"
value="true"
>
</v-radio>
</v-radio-group>
I finally was able to get it to work when using V-Binding for the value:
<v-radio-group v-model="test" class="pl-2">
<v-radio
label="Yes"
:value="true"
>
</v-radio>
</v-radio-group>
Can someone explain why this is the case? I feel like I am missing something in the documentation: https://vuejs.org/v2/guide/forms.html#Radio-1
We are using the composition API, Nuxt framework, and Vuetify (not sure if that matters)
Attributes are strings by default, so in the first case of:
<v-radio value="true">
...the value prop is actually set to the string "true".
In the second case of:
<v-radio :value="true">
...the v-bind directive evaluates true as a JavaScript expression, and assigns the resulting Boolean to the value prop.