Условие проверки React-Native-snap-carousel со значением состояния?

Я работаю над реагирующим нативным приложением. Для части слайдера я поставил плагин "Snap carousel". Мой слайдер показывает несколько элементов. По времени рассчитать элемент слайдера с делением на ширину окна/5. Теперь у меня есть 5 элементов слайдера на дисплее.

Проблема в том, что мне нужно показать текст слайдера для активного элемента слайдера и изменить цвет фона.

В элементе рендеринга я не могу использовать значение состояния или реквизита. Как я могу проверить текущее значение индекса в методе элемента рендеринга?

constructor(props) {
    super(props);
    this.state = {
        activeSlide:0
    }
}
_renderItem ({item, index, currentIndex}) {
    const self = this;
    return (
        <View style={styles.slide}>
            <View style={stylesSelect.carouselImg}>
                <Image 
                source={item.src}
                resizeMode='cover' 
                />
            </View>
            <Text>
                {item.title} 
            </Text>
        </View>
    );
}
render() {
    const { data } = this.props;
    return (
        <View style={styles.container}>
            <Carousel
                ref={(c) => { this._carousel = c; }}
                data={data}
                renderItem={this._renderItem}
                sliderWidth={width}
                itemWidth={Math.round(width/5)}
                sliderHeight={height}
                itemHeight={height}
                inactiveSlideScale={0.8}
                inactiveSlideOpacity={0.7}
                loop={true}
                onSnapToItem={(index) => this.setState({ activeSlide: index }) }
            />
        </View>
    )
}

Я хочу показать {item.title} Text только для активного элемента ползунка.


person vijayaganth    schedule 28.05.2018    source источник
comment
Пожалуйста, покажите свой код.   -  person    schedule 28.05.2018
comment
@LyoshaKorogoda, см. выше мой код   -  person vijayaganth    schedule 28.05.2018
comment
Итак, в вашем ._renderItem у вас есть индекс и активный индекс, можете ли вы сделать {this.state.activeSlide === index && <Text>{item.title}</Text>}?   -  person    schedule 28.05.2018
comment
мы не можем использовать this.state.activeSlide в методе renderItem.   -  person vijayaganth    schedule 28.05.2018
comment
Почему это? Из того, что я вижу, это просто какой-то обратный вызов, который вы создаете. Однако вам может потребоваться привязать его к правильному контексту.   -  person    schedule 28.05.2018