primevue icon indicating copy to clipboard operation
primevue copied to clipboard

Listbox: Filter array of strings

Open IvanSGurdian opened this issue 2 years ago • 0 comments

Describe the feature you would like to see added

Proper filter for array of strings.

Is your feature request related to a problem?

Currently, Listbox allows to filter an array of objects by providing an optionLabel to look for a property to use as a value to compare; when the options array is just an array of strings the filter simply won't return matches.

Describe the solution you'd like

Maybe implement a mode prop or similar to allow Listbox to filter its list of options using a simple filter() method.

Describe alternatives you have considered

I tried using a custom function on the @filter event Listbox exposes and with the filter value updating a computed property which holds the filtered items, inspecting the VueTools the array is updating correctly, but the Listbox component still only shows a No results found message even though the filtered array has items.

Additional context

I'm using the component like this:

<Listbox class="border-0" v-model="selectedField" :multiple="true" :options="filteredFields"
 :filter="true" @filter="customFilter($event)"/>
data() {
        return {
            selectedFields: [],
            filterValue: ''
        }
    },
computed: {
        filteredFields() {
            return this.myArray.filter(item => item.toLowerCase().includes(this.filterValue))
        }
    },
methods: {
        customFilter(event) {
            this.filterValue = event.value
        }
    }

I still get this

image

IvanSGurdian avatar Jun 22 '22 21:06 IvanSGurdian