search

darrenjennings / vue-autosuggest

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

Suggestion: Emit event on show/hide suggestions #178

Closed BerniML closed 4 years ago

BerniML commented 4 years ago

I'm trying to detect when the suggestions are rendered, and I think an event emit could be added when the component renders the suggestion and hides it.

The problematic scenario is:

I need to allow the browser autofill as long as the autosuggest is not rendering any suggestion. When the suggestion is rendered, I need to detect it, and change the autocomplete property in the input-props property to disable the browser autofill.

The case scenario would be the following:

Give a default value to autocomplete attribute in input-props. This value enables browser autofill. User ignores browser autofill and starts typing in the vue-autosuggest input, which renders some suggestions. Detect through the an emitted event such as renderedSuggestion that the suggestion is being shown Change the value of the autocomplete property to hide the browser autofill. I would also need to detect when the suggestions are hidden, to restore the property to it's default value.

Suggested solution:

Add new event to be triggered when the suggestion is shown and hidden.

If you agree on the solution, I'll try to get some time to do a Pull request. Also, if you can think about a better name for the emitted event, please do tell.

Thanks!

darrenjennings commented 4 years ago

Yea sounds like a good enhancement since @ events are more the vue way. The component already has a way of handling open/close events with should-render-suggestions. You can perform side effects inside this function based on what you determine.

https://github.com/darrenjennings/vue-autosuggest#shouldRenderSuggestions