no result react-native-searchable-dropdown

214 Views Asked by At

I using react-native-searchable-dropdown library , but if user write string with its not in item array I receive white screen. How I can add no result text (or its best option button who create missing option)?

2

There are 2 best solutions below

0
Любомир Мариянов On BEST ANSWER

Actually this is work , just i need to add some details , its need to be change the same Searchable dropdown file:

 const oldSupport = [
        { key: 'keyboardShouldPersistTaps', val: 'always' }, 
        { key: 'nestedScrollEnabled', val : false },
        { key: 'style', val : { ...this.props.itemsContainerStyle } },
        { key: 'data', val : this.state.listItems },
        { key: 'keyExtractor', val : (item, index) => index.toString() },
        { key: 'renderItem', val : ({ item, index }) => this.renderItems(item, index) },
        { key: 'ListEmptyComponent', val : () =>this.emptyComponent()}
    
I added : 
        { key: 'ListEmptyComponent', val : () =>this.emptyComponent()}

after that i just add

emptyComponent = () => {
    return(
      <View>
       <Text>Search result not found</Text>
       <Button title='Do Something'/>
    </View>
    );
  };

and in function

emptyComponent

you can do whatever you want

0
Lmao12233 On

If you are using flatlist to list all your data. There is a prop called ListEmptyComponent

import React from 'react', 
import {FlatList, Button, Text} from 'react-native',


const emptyComponent = () => {
  return(
     <Text>Search result not found</Text>
     <Button title='Do Something'/>
  )
};

<FlatList
  istEmptyComponent={emptyComponent}
 />
 

This will display if the search results where not found.