I need an equivalent to Vuetify's v-autocomplete

[dwissing]

I am trying to get my dropdown input field to allow typing to filter the options. After doing research, it seems that q-select does not have this built in. I am coming from Vuetify, where the v-autocomplete simply allows the user to type and it filters the list as they type.

I found examples where people have written their own filtering functions and then used a filtered array as the options list for v-select. The issue is that I have very many dropdown inputs and it would create a lot of extra work to create filters for each one.

I would like to build a reusable component that is a q-select with the filtering built in, but this is over my head. Has anyone done something like this?

Also, it would be great if this "type-to-filter" would be built in to q-select like it is in Vuetify.

[metalsadman]

I found examples where people have written their own filtering functions and then used a filtered array as the options list for v-select. The issue is that I have very many dropdown inputs and it would create a lot of extra work to create filters for each one.

I would like to build a reusable component that is a q-select with the filtering built in, but this is over my head. Has anyone done something like this?

this is the way to go, ie. you can get one of the filtering examples from docs and reuse it.

[dwissing]

This is proving to be much more difficult than I anticipated. Creating a wrapper component to add "filter-as-you-type" makes me lose all of the q-select slots for customizing the drop-down appearance.

[TobyMosque]

u can write a transparent wrapper.
https://codepen.io/tobias-mesquita/pen/OJzBLyQ?editors=1010