Vuetify is a popular UI framework for Vue apps.

In this article, we’ll look at how to work with the Vuetify framework.

Radio Buttons

We can add radio buttons with the v-radio component.

For example, we can write:

<template>
  <v-container>
    <v-row>
      <v-col col="12">
        <p>{{ radios }}</p>
        <v-radio-group v-model="radios" :mandatory="false">
          <v-radio label="Radio 1" value="radio-1"></v-radio>
          <v-radio label="Radio 2" value="radio-2"></v-radio>
        </v-radio-group>
      </v-col>
    </v-row>
  </v-container>
</template>
<script>
export default {
  name: "HelloWorld",
  data: () => ({
    radios: '',
  }),
};
</script>

Setting the mandatory prop to false makes it optional.

#programming #software-development #javascript

Vuetify — Radio Buttons and Switches
3.80 GEEK