Vuetify v-text-field не обновляет значение при его изменении.Даже на $ forceUpdate ()

Question

Vuetify v-text-field не обновляет значение при его изменении.Даже в $ forceUpdate () и при использовании $ set

я пытался использовать его без $ forceUpdate и $ set, но даже с обоими этими методами он не работает

Пример что РАБОТАЕТ РАБОТАЕТ БЕЗ vuetify: https://jsfiddle.net/gu273qy0/3/

Пример того, что НЕ работает С Vuetify: https://jsfiddle.net/gu273qy0/5/

Этот javascript можно использовать в обоих примерах.

new Vue({
  el: "#app",
  data: () => ({
    todos: ['']
  }),
  methods: {
    setText(index, todo){
        if (todo.toString().match(/^((([A-Z]{3})[UJZ](\d{0,7}))|[A-Z]{0,3})$/)) {
        this.$set(this.todos, index, todo)
      }

      this.$forceUpdate()
    },
    addText() {
        console.log(this.todos)
            this.todos.push('')
    }
  }
})

Я ожидаю, что точно такая же реализация работает с vuetify и без vuetify.К сожалению, это не случай.Работает только пример без vuetify.

Пример допустимого значения или todo - AAAU0101201.

Примером недопустимого значения является AAAA

Answer 1

Я не могу объяснить, почему у вас не совпадают результаты с Vuetify или без, но на самом деле, с примером Vuetify, если вы введете неправильное значение, то массив todos не будет изменен, и поэтому модель выиграла 't быть обновленным

Я думаю, что вы должны, например, обрабатывать @blur событие: https://jsfiddle.net/v6m2tyrs/1/