UnPourTous / react-native-search-list

A searchable ListView which supports Chinese PinYin and alphabetical index.
https://github.com/UnPourTous/react-native-search-list
159 stars 66 forks source link

Example #3

Closed CarbonChili closed 6 years ago

CarbonChili commented 6 years ago

This is not really an issue but also this is missing an example so I cant see exactly whats going on. Ive managed to get it to pull data from an external file but how to link the row to its prop and pass to another page.

erichua23 commented 6 years ago
  1. If you want to pull data from an external file, read it and convert the data format as
    let dataSource = [
        {'searchStr': 'Alpha_one'},
        {'searchStr': 'Beta_one'},
        {'searchStr': 'Alpha_second'},
        {'searchStr': 'Charles_one'},
        {'searchStr': 'Bob_second'},
        {'searchStr': 'Charles_second'},
        {'searchStr': 'Dog_one'},
        {'searchStr': 'Dog_second'}]

    Each item will be rendered in renderRow like

    renderRow (item: Object,
             sectionID: number | string,
             rowID: number | string,
             highlightRowFunc: (sectionID: ?number | string, rowID: ?number | string) => void,
             isSearching: bool) {
    return (
      <View key={rowID} style={{flex: 1, marginLeft: 40, height: cellHeight, justifyContent: 'center'}}>
        <Text>{item.searchStr}</Text>
      </View>
    )
    }

    your can get a much more detail example at master/example/index.ios.js

I will add more detail example in README.md