From 2b7e9856d89235b33a1aa00e784372eb38496b81 Mon Sep 17 00:00:00 2001 From: kolaente Date: Thu, 24 Jun 2021 15:22:48 +0200 Subject: [PATCH] Fix flickering pre-loaded search results when focusing the search input --- src/components/input/multiselect.vue | 9 ++++++++- 1 file changed, 8 insertions(+), 1 deletion(-) diff --git a/src/components/input/multiselect.vue b/src/components/input/multiselect.vue index 34a81fad..0d6bc442 100644 --- a/src/components/input/multiselect.vue +++ b/src/components/input/multiselect.vue @@ -28,7 +28,7 @@ :placeholder="placeholder" @keydown.down.exact.prevent="() => preSelect(0)" ref="searchInput" - @focus="() => showSearchResults = true" + @focus="handleFocus" /> @@ -258,6 +258,13 @@ export default { closeSearchResults() { this.showSearchResults = false }, + handleFocus() { + // We need the timeout to avoid the hideSearchResultsHandler hiding the search results right after the input + // is focused. That would lead to flickering pre-loaded search results and hiding them right after showing. + setTimeout(() => { + this.showSearchResults = true + }, 10) + }, select(object) { if (this.multiple) { if (this.internalValue === null) {