How to pass props with value (image index) from component to main view. Building Image gallery in React Native

Viewed 23

I an trying to pass the Image index from "Card.js" component to change the background/cover image dinamicaly when the user press the Image from the Array. enter image description here

In my Card.js I pass the array of images like this:

function Card({
  title,
  onPress,
  onPress2,
  coverUri,
  galleryUrls,
 
}) { return...

<FlatList
            contentContainerStyle={{ paddingStart: 20, paddingEnd: 20 }}
            horizontal
            showsHorizontalScrollIndicator={false}
            snapToAlignment="start"
            decelerationRate={"fast"}
            snapToInterval={100}
            data={galleryUrls}
            renderItem={({ item, index }) => (
              <TouchableWithoutFeedback onPress={onPress2}>
                <View>
                  <Image
                    uri={item}
                    preview={{ uri: item }}
                    tint="light"
                    style={styles.image}
                  />
                </View>
              </TouchableWithoutFeedback>
            )}
          />

What logic I can build to achieve this behaviour?

0 Answers
Related