Я использую AsyncTypeahead
для запроса к бэкэнду GraphQL, и все работает, кроме одного небольшого визуального сбоя.Не асинхронная версия предназначена для фильтрации фиксированного списка параметров в раскрывающемся меню по типу пользователя.Но в асинхронной версии бэкэнд-запрос выполняет фильтрацию, поэтому мне не нужна фильтрация во внешнем интерфейсе.
Проблема заключается в том, что отображаемое меню фильтруется и перерисовывается после отправки запроса, но до появления новых результатов.Вернись.Это приводит к ненужному и вводящему в заблуждение обновлению пользовательского интерфейса во время ожидания результатов.
Например, скажем, вы ищете продуктовые товары.Пользователь вводит «ба» и видит
- разрыхлитель
- бананы
- батончики мюсли
Они передумали, удалили "ba "и введите" s ", и новый запрос будет отправлен.Но прежде чем результаты возвращаются, пользовательский интерфейс фильтрует существующий список (элементы, содержащие «ba») на элементы, содержащие «s», и отображает
Как только вернутся полные результаты, пользовательский интерфейс снова обновится, чтобы показать все, что содержит "s".
- бананы
- батончики мюсли
- шампунь
- крем для бритья
Как можно устранить эту вспышку, обновив пользовательский интерфейс только , когда новые результаты (называемые options
в компоненте) предоставляютсяасинхронный запрос?