react-native-section-alphabet-list
react-native-section-alphabet-list copied to clipboard
Feature request: Incorporate search/autocomplete
Hello, This may be a feature request that not a lot of people are interested in but I see your alphabet list as a great component for displaying a contact list and any other ordered long list. To that effect, I would love to see an integration with a searchable section list component made possible. Example: https://github.com/mrlaessig/react-native-autocomplete-input
Live search would fit in better imo
Agreed, I've implemented it in my own project using the search bar from react-native-elements and a simple filter function:
searchFilterFunction = (text) => {
// Check if searched text is not blank
if (text) {
// Inserted text is not blank
// Filter data source (this.state.words)
// Update the filtered data source (this.state.filteredWords)
const newData = this.state.words.filter(
function (item) {
const itemData = item.value
? item.value.toUpperCase()
: ''.toUpperCase();
const textData = text.toUpperCase();
return itemData.indexOf(textData) > -1;
});
this.setState({filteredWords: newData});
this.setState({search: text});
} else {
// Inserted text is blank
// Update the filtered data source (this.state.filteredWords) with the master data source
this.setState({filteredWords: this.state.words})
this.setState({search: text});
}
};
this will become very slow when you have huge data to display