Question

我有一个Vuetify选择，使用以下语法。

<v-select label="..." autocomplete 
     append-icon="search" :items="plots" item-value="id" item-text="plotHeader" 
     v-model="selectedPlot" v-on:change="loadPlotInformation();">
</v-select>

因此，当页面加载时，下拉列表会使用Ajax请求进行初始化。但是当用户更改值时，模型会反映旧值，而不是当前选择。

在函数内部。

loadPlotInformation() {
     console.log(this.selectedPlot);
}

更新

我能够通过转换到模糊事件来解决问题。但为什么改变事件不会解决？

Answer 1

如果要采用新值而不是旧值，则应使用nextTick方法。例如：

   loadPlotInformation() {
     this.$nextTick(() => {
         console.log(this.selectedPlot);
        })
    };

Answer 2

尝试更改函数以读取函数的参数。

loadPlotInformation(e) {
    console.log(e);
}

但是这样您需要检查是否要更新模型变量

Vuetify Select保留旧价值

2 个答案: