第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

Vuetify 組合框中更新模型的問題

Vuetify 組合框中更新模型的問題

開滿天機 2023-03-03 10:28:33
我在使用 v-combobox 時遇到問題。(參見 代碼示例)。如果我執(zhí)行以下操作,則會出現(xiàn)問題:在組合框中輸入一個字符串在組合框未聚焦之前單擊保存按鈕。方法 save() 被執(zhí)行console.log() 返回前一個值而不是實際值。如何在執(zhí)行保存命令期間獲取“值”的實際值?<template>  <v-app>    <div id="app">      <v-card>        <v-card-text>          <v-container>            <v-combobox v-model="value" label="write"></v-combobox>          </v-container>        </v-card-text>        <v-divider></v-divider>        <v-card-actions>          <v-spacer></v-spacer>          <v-btn text color="secondary" @click="save">save</v-btn>        </v-card-actions>      </v-card>    </div>  </v-app></template><script>export default {  name: "App",  data() {    return {      addDialog: "false",      value: ""    };  },  methods: {    save() {      console.log(this.value);      this.addDialog = false;    }  }};</script>
查看完整描述

2 回答

?
蝴蝶刀刀

TA貢獻1801條經(jīng)驗 獲得超8個贊

那么讓我們從正確完成的事情開始:

  1. 您的組合框已正確地 v 建模為您的值數(shù)據(jù)變量。

  2. 您在 save() 方法中正確引用了數(shù)據(jù)變量。

但是,對于組合框,默認行為是 v-model 變量不會實際更新,直到您失去對輸入的關(guān)注。如果您嘗試使用上面的代碼,在組合框中寫一些東西,然后單擊/跳出它,然后單擊保存,它應(yīng)該會按您預(yù)期的那樣工作。

為了讓它自動工作,我們實際上可以通過使用 blur 方法在 save() 中失去組合框的焦點。

首先,將 ref 添加到您的組合框。然后,調(diào)用這個 ref 的 blur 方法作為你在保存函數(shù)中做的第一件事。最后,我們需要使用 nextTick 來確保該值已完全更新,然后再嘗試對其進行 console.log。代碼的更新部分如下所示:

<v-container>

    <v-combobox v-model="value" ref="myComboBox" label="write"></v-combobox>

</v-container>


...


save() {

    this.$refs["myComboBox"].blur();

    this.$nextTick(() => {

        console.log(this.value);

        this.addDialog = false;

    });

}


查看完整回答
反對 回復(fù) 2023-03-03
?
慕虎7371278

TA貢獻1802條經(jīng)驗 獲得超4個贊

你可以只使用 :search-input.sync 標簽而不是 v-model。在你的情況下:

<v-combobox :search-input.sync="value" label="write"></v-combobox>

就這樣


查看完整回答
反對 回復(fù) 2023-03-03
  • 2 回答
  • 0 關(guān)注
  • 139 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號