Is there any way to load more on carousel when it touches end

[kiranjd]

You can make use of VirtualizedList's props, onEndReached in conjunction with onEndReachedThreshold

[kickbk]

@kiranjd, any chance on getting these methods added to the typescript definitions, or would you recommend extending the type definitions of the carousel when using these? Could you please share how you would do this?

[kiranjd]

@kickbk Not familiar with TS

[hopewise]

I tried it, but its not called when reaching end, I am using right to left as:

<Carousel                  
                    useScrollView={true}
                    firstItem={this.state.ayat.length-1}
                    sliderWidth={360}
                    itemWidth={360}
                    ref={ref => (this.scrollRef = ref)}
                    decelerationRate={'fast'}
                    snapToAlignment={'center'}
                    snapToInterval={360}
                    pagingEnabled={true}
                    initialPage={0}                                      
                    data={this.state.ayat}
                    renderItem={({item})=>(
                      <RenderAyaItem
                          item={item}
                          onPressOptions={() =>
                            this.setState({showModalSettings: true})
                          }
                          onPressPlay={this.onPressPlay}
                          onPressFav={this.toggleFav}
                          onPressBookmark={this.toggleBookmark}
                          isBookmared={item.dbID == this.state.bookmark}
                        />
                    )}

                    onEndReached={this.retrieveMore}

                    initialNumToRender={page_size}                 
                    removeClippedSubviews={true}/>                    

please advice

[dohooo]

Sorry, please allow me to advertise for my open source library! ~ I think this library react-native-reanimated-carousel will solve your problem. It is a high performance and very simple component, complete with React-Native reanimated 2