React Native

How to finding index at the time of scrolling on flatlist in react native

Posted On
Posted By Neha Dwivedi

<FlatList style={{ marginTop: 20, marginLeft: 20, marginRight: 20 }}

data={this.state.data}
pagingEnabled={true}
onTouchStart={() => console.log('onTouchStart')}
onTouchMove={() => console.log('onTouchMove')}
onTouchEnd={() => console.log('onTouchEnd')}
onScrollBeginDrag={() => console.log('onScrollBeginDrag')}
onScrollEndDrag={() => console.log('onScrollEndDrag')}

onMomentumScrollBegin={() =>
console.log('onMomentumScrollBegin')}
onMomentumScrollEnd={() => console.log('onMomentumScrollEnd')}
onScroll={() => this.handleScroll()}
extraData={this.state.refreshflatlist}
ListEmptyComponent={() => API.noRecorsFound()}
renderItem={({ item, index }) => {

return (
this.setModalDataDynmically(!
this.state.modalVisible, item, item.hostedEvents, item.name, item.isAvailable,
item.isliked, item.id)} style={{ backgroundColor: 'rgba(246,201,120,1)',
borderRadius: 50, height: 100, flexDirection: 'row', marginBottom: 10,
justifyContent: 'flex-start', alignItems: 'center', position: 'relative' }}>

<Text>{(item.date) ? item.date : item.isAvailable}</Text>
) } } />

And if any other query/issue then please comment.

Happy Coding Guyz.

Related Post

leave a Comment

Latest Post

React Native

How to generate keytool for android release and debug build

Read More
Posted On
React Native

How to finding index at the time of scrolling on flatlist in react native

Read More
Posted On
React Native

How to exit from the app with user confirmation in react native

Read More
Posted On
React Native

How to open phone default calendar in react-native

Read More
Posted On
React Native

How to change Android package name in react-native

Read More
Posted On