[英]React Native Carousel UseState
I am currently implementing a carousel library ( react-native-reanimated-carousel
).我目前正在实施一个轮播库 ( react-native-reanimated-carousel
)。 The code for the following is represented as such:以下代码表示如下:
<Carousel
width={cardWidth}
height={cardHeight}
data={cards}
onScrollEnd={() => {console.log('ended')}}
renderItem={({item}) =>
(
<View>
<Image
source={{uri: item["ImgURL"],}}
style={styles.card}
/>
</View>
)}
/>
Upon the carousel changing, the item
value in the renderItem
property changes.旋转木马发生变化时, renderItem
属性中的item
值也会发生变化。 Is there a way to get the value of item
from outside this element?有没有办法从该元素外部获取item
的值? I want other elements outside to change depending on the value (and properties) of item
.我希望外部的其他元素根据item
的值(和属性)进行更改。
You could try to call a callback function in the renderItem
function.您可以尝试在renderItem
function 中调用回调 function。
() => {
const [activeItem, setActiveItem] = useState(cards[0].item);
return (<Carousel
width={cardWidth}
height={cardHeight}
data={cards}
onScrollEnd={() => {console.log('ended')}}
renderItem={({item}) => {
setActiveItem(item);
return (
<View>
<Image
source={{uri: item["ImgURL"],}}
style={styles.card}
/>
</View>
);
}}
/>)
);
};
Or you could use onScrollEnd.或者你可以使用 onScrollEnd。 It provides the previous index and the current index according to the documentation它根据文档提供了以前的索引和当前索引
() => {
const [activeItem, setActiveItem] = useState(cards[0].item);
return (<Carousel
width={cardWidth}
height={cardHeight}
data={cards}
onScrollEnd={(previous, current) => {
setActiveItem(cards[current].item);
console.log('ended')
}}
renderItem={({item}) => (
<View>
<Image
source={{uri: item["ImgURL"],}}
style={styles.card}
/>
</View>
)}
/>)
);
};
Or you could use the Ref prop getCurrentIndex或者你可以使用 Ref 道具getCurrentIndex
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.