Блог

У меня есть ввод и выбор в моем приложении VUE, которые отображаются в зависимости от выбора предыдущего ввода. Если я вставляю значения и изменяю начальный выбор ввода, я скрываю второй ввод и выбираю, чтобы перезапустить форму. Проблема возникает, когда я перезапускаю форму, и я все равно получаю выбранные значения при первой загрузке. Я пытаюсь сбросить значения, но ни один из методов, которые я нашел в подобных обзорах случаев, не работает нормально. Вот мой выбор и мой ввод, который я хочу сбросить значения

               <h1 v-if="this.isSelected"> What's your selection ?</h1>
              <select
                ref="item"
                class="form-control"
                id="selectedItem"
                v-model="itemFormInfo.selectedItem"
                @change="onChangeItem($event)">
                <option v-for="item in filteredItem" v-bind:key="item.name">{{ item.name }}</option>
              </select>
              <div v-show="this.isItemSelected">
                <h1>what's your item name ?</h1>
                <input
                  type="text"
                  id="name"
                  ref="itemName"
                  class="form-control fields"
                  style="text-transform: capitalize"
                  v-model="itemFormInfo.name"
                  @keypress="formChange($event)"
                />
                <div class="loader-spinner" v-if="loading">
                  <app-loader/>
                </div>
              </div>



  

и вот мой метод, в котором я попробовал методы reset и document.getElementById(«).value(«»);

     onChangeSpecie(event) {
      let specie = event.target._value;
      this.specieName = this.getSpecieName(specie);
      this.breedName = this.getBreedName(specie);
      this.$refs.breed.focus();
      if (this.isBreedSelected = true) {
        this.isBreedSelected = false;
        this.isNameCompleted = false;
        this.isLoaderFinished = false;
        this.$refs.animalName.item()

      }
    },


  

Если я печатаю с помощью консоли, я вижу, как значение очищается, но ввод отображается с записанным значением, пока я не сосредоточусь на .
Как мне остановить его отображение?
ни в одном из методов он не стирает мои предыдущие значения, отображаемые на входе.
что я делаю не так?
заранее спасибо всем за помощь и время

Я считаю, что вам нужна null модель, а не значение целевого элемента.

 this.itemFormInfo.name = null