[Vuejs]-'undefined' value with first click on a vuetify v-chip-group v-chip

by

0👍

https://v2.vuejs.org/v2/guide/reactivity.html#For-Arrays

Vue 2’s reactivity system can’t detect when you change an array’s element using index.

The equivalent of

<input v-model="yourProperty/>

is

<input :value="yourProperty" @input="newValue => {value = newValue}
<!-- or alternatively: -->
<input :value="yourProperty" @input="value = $event"/>

So you need to write your own input handler that use Vue.set rather than the JavaScript = operator

So try

<template>
<v-chip-group
  :value="meh[index]"
  @input="newChipGroupValue => handleInput(newChipGroupValue, indexToUpdate)"
>
...
</template>
<script>
...
methods: {
  handleInput(newChipGroupValue, indexToUpdate) {
    //remember to import Vue from vue
    Vue.set(this.meh, indexToUpdate, newChipGroupValue);
  }
}
</script>

-1👍

Sir, maybe you can put the event under v-chip-group.

<v-chip-group
v-model="meh[index]"
multiple
@event here

Leave a comment