I have a large list of local images. when reaching 10 images I load 10 new ones. and I scrollToIndex(0).
at first it works perfectly, but at the last list (<10 images) it doesn't scrollToIndex(0) but it still at the last one.
onPress={() => { this.loadmore(index); }}
loadmore= (ind) =>{
var nxt=ind+1
if(nxt<10 ){this._carousel.scrollToIndex(nxt);
console.log("ind=",ind+1);
}
else{
console.log("EndReached ind=", nxt);
console.log("last_page",this.state.last_page);
var j=this.state.last_page +10;
this.setState({
last_page:j
});
if(j<long){
this.setState({ animating: true})
var temp = [];
for (let i = j; i < long && i<j+10 ; ++i) {
temp.push(Slidesdata[bab_id].images[i]);
console.log('i=',i);
}
this.setState({
data: temp,
});
console.log(temp);
this.closeActivityIndicator();
this._carousel.scrollToIndex({index:0});
console.log("loaded");
}
I have a large list of local images. when reaching 10 images I load 10 new ones. and I scrollToIndex(0). at first it works perfectly, but at the last list (<10 images) it doesn't scrollToIndex(0) but it still at the last one.
onPress={() => { this.loadmore(index); }}
loadmore= (ind) =>{
}
} }
<Carousel data={this.state.data} keyExtractor={(item, index) => index.toString()} renderItem={this._renderItem.bind(this)} itemWidth={wp('100%')} containerWidth={wp('100%')} itemContainerStyle={{height:hp('80%'),}} separatorWidth={0} ref={(c) => { this._carousel = c; }} initialIndex={0} initialScrollIndex={0} onScrollEnd={() => console.log("scrolling")} initialNumToRender={10}
How to fix it?