मेरे पास एक Vuetify combobox है जो सहेजने पर चयनित या दर्ज मूल्य को स्टोर करने के लिए एक एपीआई कॉल करता है। हालांकि, इस मान को अपडेट करते समय, यदि कॉम्बोबॉक्स को अचयनित किए बिना सेव बटन को सीधे क्लिक किया जाता है, तो पहले से संग्रहीत मूल्य नए मान के बजाय फिर से संग्रहीत किया जाता है। केवल जब मैं मैन्युअल रूप से बॉक्स को अचयनित करता हूं या एंटर दबाता हूं तो सही मूल्य स्टोर होता है। मैंने चारों ओर देखा है और कुछ सुधारों को पाया है जो दूसरों के लिए काम करते हैं, जैसे कि .blur() और .$nextTick, लेकिन वे मेरे लिए काम नहीं कर रहे हैं (मैं उन्हें गलत तरीके से लागू कर सकता था)। यहाँ मेरे पास क्या है:

सम्मिश्रण पटी:

<v-combobox
  :items="suggestions"
  v-model="editedItem.field_label"
  label="Label"
  outlined
  dense
  ref = "comboBox"
></v-combobox>

सहेजें बटन:

<v-btn color="blue darken-1" text @click="save"> Save</v-btn>

समारोह सहेजें:

save() {
  this.$refs.comboBox.$emit("blur")
  this.$nextTick(() => {
    const device_field = {
      ...this.editedItem,
    };
      device_field_api
        .updateDeviceField(device_field, this.device_id)
        .then((r) => {
          //Various logging items
          );
        })
        .finally(this.initialize())
        .catch((e) => {
          //Error catching
          );
        });
    });
  }
0
Scott Myers 10 सितंबर 2020, 21:12

1 उत्तर

सबसे बढ़िया उत्तर

परिवर्तन this.$refs.comboBox.$emit("blur") इसके लिए: this.$refs.comboBox.blur()

कोडपेन उदाहरण

नतीजा: यहां छवि विवरण दर्ज करें

1
Lazac92 15 सितंबर 2020, 22:10