Блог

Главная - Вопросы по программированию - Vuetify — значение события первого нажатия клавиши всегда является пустой строкой

Vuetify — значение события первого нажатия клавиши всегда является пустой строкой

#javascript #vue.js #vuejs2 #vuetify.js

#javascript #vue.js #vuejs2 #vuetify.js

Вопрос:

Я хочу, чтобы пользователь не мог вставить число больше 100.

Приведенный ниже отрывок представляет собой упрощенный производственный код. По какой-то причине, которую я пока не понимаю, заключается в том, что первое нажатие клавиши всегда возвращает пустую строку.

Если вы введете 101 ввод, event.target.value значение будет 01 .

Как я могу это исправить?

 <v-text-field
    type="number"
    @keypress="formatNumber($event)"
>
</v-text-field>

formatNumber(event) {
    console.log(event.target.value); // first keypress returns empty string

    if (event.target.value  > 100) {
        event.target.value = null;
    }
}

Комментарии:

1. изменить keypress на keyup

Ответ №1:

Изменение keypress на keyup вызывает функцию правильно

Комментарии:

1. Я пробовал это, и есть одно предостережение. Вставленное значение появится снова после того, как вы потеряете фокус ввода. т.е. Вы вводите 101, выбираете другой ввод, и значение 101 снова появится при предыдущем вводе.

2. @Carol-TheodorPelu можете ли вы использовать v-model?

3. Я могу использовать v-model . Каким будет подход в этом случае?

4. если v-model="someVar" затем из функции, установленной this.someVar = null вместо event.target.value

5. это работает, но я все еще удивляюсь, почему значение события первого нажатия клавиши является пустой строкой.