@andrewgul

Почему на Android в Google Chrome некорректно работает input (приложение на Vue.js)?

Приветствую!

Пишу приложение на Vue.js. В нем есть input, при каждом изменении его значения должна производится фильтрация списка метро (на мой взгляд довольно стандартная ситуация).

<input
    type="text" 
    class="select-input" 
    v-model="searchInput"
    @keydown="searchMetro"
    placeholder="Поиск"
    autocomplete="off"
    autocorrect="off"
    autocapitalize="off"
    spellcheck="false"
    aria-autocomplete="none"
>


На компе все работает нормально (Chrome, Safari, Firefox), на iOS тоже (Safari, Chrome). Событие отлавливается, список фильтруется. Проблемы возникают только с Chrome на Android. Пока не будет нажат пробел либо не будет переведен фокус, инпут как будто не получает введенное значение. Насколько я понял, это может быть особенность ввода с клавиатуры в андроиде (проверка орфографии или что-то в этом роде). Пробовал добавить атрибуты autocomplete, autocorrect, autocapitalize, spellcheck (подсмотрел у Яндекса) – ничего не поменялось. Так же пробовал отлавливать событие keydown/keyup на инпуте – тоже толку ноль.

Подскажите, пожалуйста, что в данной ситуации можно сделать?
  • Вопрос задан
  • 65 просмотров
Пригласить эксперта
Ответы на вопрос 1
Fragster
@Fragster
помогло? отметь решением!
Не используй событие keydown, используй наблюдателя за моделью или вообще сделай отображаемый список вычисляемым на основе модели.
Собственно, есть прям пример в документации под это: https://ru.vuejs.org/v2/examples/grid-component.html
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы