Reactjs “如何修复”；活动页面指示器样式的索引不正确；在本地旋转木马横幅中

我使用了从npm下载的库

react native banner carousel

：

不幸的是，我在初次运行时遇到了一个问题： 不正确的活动页面指示器例如：索引0处的图像，指示器应位于索引0处，不幸的是，索引3处的指示器，以下是我的代码：

  <View style={ {flex: 1,paddingTop: 20 }}>
                        <Carousel autoplay={true} autoplayTimeout={1000} loop={true} index={0} pageSize={BannerWidth} activePageIndicatorStyle={{backgroundColor: '#fff' , direction: 'rtl'}} pageIndicatorContainerStyle={{direction: 'rtl' }} >
                        {this.state.carouselData.map((ad_info, index) => this.renderPage(ad_info, index))}
                          </Carousel>
                                       </View>

{this.state.finishDownloadAdsImageFromServer ? (<View style={styles.carouselContainer}>
                        <Carousel
                                    autoplay
                                    autoplayTimeout={1000}
                                    loop
                                    index={0}
                                    pageSize={BannerWidth}
                                    activePageIndicatorStyle={{backgroundColor: '#fff' }}
                                >
                        {this.state.carouselData.map((ad_info, index) => this.renderPage(ad_info, index))}
                          </Carousel>
                                       </View>) :  <View/>}

{this.state.carouselData.map（（广告信息，索引）=>this.renderPage（广告信息，索引））}

“渲染页”功能是：

renderPage(ad_info, index) {
  console.log("Ghadeer index", index , "::" , ad_info.ad_Title)
  var base64Icon = 'data:image/png;base64,'+ ad_info.ad_Banner;
      return (
          <TouchableOpacity transparent style={{width:BannerWidth,height:130, zIndex: 2}} transparent
                  onPress={() => this.openWebView(ad_info)}>
                  <Image
                  style={{width:BannerWidth , height: 130 , justifyContent: 'center', alignItems: 'center'}}
                       source={{uri: base64Icon}}
                  />
              </TouchableOpacity>
      );
  }

renderPage（广告信息，索引）{
log（“Ghadeer索引”，索引，：：”，广告信息，广告标题）
var base64Icon='data:image/png；base64'，+ad_info.ad_横幅；
返回(
this.openWebView（广告信息）}>
);
}

预期行为：

第一次加载时的当前行为：

---

问题在于从服务器下载图像。 我的修正方法是：从服务器下载完成后初始化转盘，下面是我的代码：

  <View style={ {flex: 1,paddingTop: 20 }}>
                        <Carousel autoplay={true} autoplayTimeout={1000} loop={true} index={0} pageSize={BannerWidth} activePageIndicatorStyle={{backgroundColor: '#fff' , direction: 'rtl'}} pageIndicatorContainerStyle={{direction: 'rtl' }} >
                        {this.state.carouselData.map((ad_info, index) => this.renderPage(ad_info, index))}
                          </Carousel>
                                       </View>

{this.state.finishDownloadAdsImageFromServer ? (<View style={styles.carouselContainer}>
                        <Carousel
                                    autoplay
                                    autoplayTimeout={1000}
                                    loop
                                    index={0}
                                    pageSize={BannerWidth}
                                    activePageIndicatorStyle={{backgroundColor: '#fff' }}
                                >
                        {this.state.carouselData.map((ad_info, index) => this.renderPage(ad_info, index))}
                          </Carousel>
                                       </View>) :  <View/>}

{this.state.finishDownloadsImageFromServer(
{this.state.carouselData.map（（广告信息，索引）=>this.renderPage（广告信息，索引））}
) :  }

谢谢