Option to show results only on modify and arrow keys instead of focus

[NesCafe62]

Would be useful to have some option that defines what events should trigger search and display dropdown with results. In my case I'm trying to replicate the behavior of my old jQuery component, that was custom select with search ability. So I wolud like it to dropdown on value change or ArrowUp, ArrowDown, Enter keys.

[NesCafe62]

I ended up with making my own component, but using yours as a guidance. It seems the desired behavior is too different in my case, and this component sort of was made for another purposes. Also trying to minimise DOM changes, as I need a fixed set of options and just filter them on typing (maybe later will add an ability to async load them). So only have to hide them and avoid add/remove operations. It fixes the delay that happends when options list is large.

[trevoreyre]

This is a use case I want to support eventually, but you're right, in its current form the component isn't really built for this. I'll add a reminder to take a look at this for v3.

[NesCafe62]

I created a repo with my solution https://github.com/NesCafe62/vue-SelectAutocomplete, maybe could be useful when you will work on 3rd version. CodePen: https://codepen.io/nescafe62/pen/mdyyQwK. No installation yet. Options list is static yet, no async loading while typing.

There are some behaviors:

• Options are opened on input change, arrow keys, Enter or button click.
• ArrowUp and ArrowDown keys highlight next/prev visible option (or first if no previos highlighted), but only if options are opened.
• On open highlighted option will be reset to selectedIndex and scroll to it's position. If selectedIndex not set, none will be highlighted.
• On pressing arrowRight key when options are opened, inputText will be changed to highlighted option (but it wont change selectedIndex until you press Enter, select option with mouse click or input lose focus).
• On focus lost if inputText is indetical with one of option text, it will change selectedIndex value, or clear selectedIndex if text is empty, else inputText will be reverted to selectedIndex option text.
• Search occurances are highlighted inside options.
• Button toggles options opened.