primevue
primevue copied to clipboard
Listbox: Filter array of strings
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