[Vuejs]-Check all values in radio buttons (vuetify)?

1👍

No, you cannot. This is just bad design. You shouldn’t break user expectations and design standards.

Instead use v-checkbox elements for everything:

Demo: https://codepen.io/AlekseiHoffman/pen/poJVrxm?editors=1010

Code

<v-checkbox
  v-model="selectAll"
  @change="selectAllCheckboxes"
  label="Select all"
  hide-details
></v-checkbox>

 <v-checkbox
  v-for="checkbox in checkboxes"
  v-model="selectedCheckboxes"
  :value="checkbox"
  :label="checkbox"
  hide-details
></v-checkbox>
data: () => ({
  selectAll: false,
  selectedCheckboxes: [],
  checkboxes: ['checkbox 1', 'checkbox 2']
}),
methods: {
  selectAllCheckboxes () {
    if (this.selectAll) {
      this.selectedCheckboxes = [...this.checkboxes]
    }
    else {
      this.selectedCheckboxes = []
    }
  }
}

Leave a comment