Как вызвать функцию при изменении выбора в v-select?

В настоящее время я работаю над Vuetify, пытаясь вызвать метод в Vue.js из v-выберите с помощью HTML. Но событие @change неправильно выбирает условия.

<v-layout row wrap>
    <v-flex xs12 sm4>
      <!-- DropDown Combo -->
      <v-select v-model="selected"
        :items='dropdown_tables'
        append-icon='fa-angle-down'
        label='Select'
        persistent-hint
        return-object
        single-line
        @change='RefreshGrid'
        target='#dropdown'>
        </v-select>
        <!-- <p> {{`${selected}`}} </p> // this code gives the selected combo text -->
    </v-flex>
   </v-layout>
</v-container>

Моя функция Javascript

 methods: {
   RefreshGrid: function () {
   let cName;
   if (this.selected === 'Business Area') {
    cName = 'businessArea';
   } else if (this.selected === 'Council') {
     cName = 'council';
   }
   let obj = {
    vm: this,
    collectionName: cName,
    action: 'masterData/setMasterData',
    mutation: 'setMasterData'
   };
   this.$store.dispatch(obj.action, obj);
 }

Поэтому, когда я использую изменения и нажимаю на совет, они отображают данные businessArea в сетке и наоборот. Попытка выяснить, как работает индексирование v-select.

1 ответ

Итак, используя @input вместо @change работает отлично.

Другие вопросы по тегам