darrenjennings / vue-autosuggest

🔍 Vue autosuggest component.
https://darrenjennings.github.io/vue-autosuggest
MIT License
621 stars 91 forks source link

option to close on blur #233

Open jstaerk opened 2 years ago

jstaerk commented 2 years ago

Relevant code or config My workaround:

    blur() {
      this.suggestionHasFocus=false;
    },
    focus() {
      this.suggestionHasFocus=true;
    },
    shouldRenderSuggestions (size, loading) {
      return size >= 0 && !loading && this.suggestionHasFocus;
    },

What you did:

typed something, left the input using e.g. the <TAB> key

What happened:

It closes the suggestion box only if I apply my workaround

Problem description:

Is there a option I miss or a particular reason why the suggestions are only closed when one clicks somewhere outside and not as well when the focus changes to another element?

Suggested solution:

my code

bryan-gilbert commented 7 months ago

I tried the above but then found that any mouse click on one of the options would close the dropdown but NOT select the option clicked. I took away the @blur property and the click on option worked again but then TAB away was broken again. I think this workaround helps.

        @focus="autoSuggestHasFocus = true"
        @keydown.tab="autoSuggestHasFocus = false"

with your suggested shouldRenderSuggestions()