React Native 如何使 Carousel 重定向到选择了相应 ID 的另一个页面

Question

我是 React Native 的新手，我试图在按下轮播组件卡片后，它应该导航到其他页面并从卡片数组发送相应的 ID。

这是我的“.App.js”页面，它工作正常：

export default function App() {
  return (
    <NavigationContainer>
      <Stack.Navigator>
        <Stack.Screen name='Receita' component={selectType} />
        <Stack.Screen name='Informe os ingredientes' component={findRecipe} />
      </Stack.Navigator>
    </NavigationContainer>
  );
}

这是轮播数组：

const carouselItems = [
  {
    id: 1,
    title: "Doce",
    text: "[TEXTO DESCRITIVO]",
    illustration: require('../../assets/sobremesa.jpg'),
  },
  {
    id: 2,
    title: "Salgado",
    text: "[DESCRIÇÃO]",
    illustration: require('../../assets/refeicao.jpg'),
  },
]

这是我要更新的 Carousel 组件，按下后，它应该将用户转到 'findRecipe' 页面

return (
    <View style={styles.container} >
      <TouchableOpacity onPress={goForward}>
        <Text style={styles.titleText}>Selecione o tipo de receita</Text>
      </TouchableOpacity>
      <Carousel
        layout={"default"}
        ref={ref => carousel = ref}
        data={carouselItems}
        sliderWidth={screenWidth}
        sliderHeight={screenWidth}
        itemWidth={screenWidth - 60}
        renderItem={renderItem}
        onSnapToItem={index => setState({ activeIndex: index })}
        hasParallaxImages={true}
      />
      <Button title='INGREDIENTES' onPress={() => navigation.navigate('Informe os ingredientes')}></Button>
    </View >
  );

我有办法在 Button 组件中执行此操作，但我确实需要在 Carousel 卡上执行此操作并发送按下的相应寄存器的 ID。有人可以帮忙吗？

Answer 1

示例发送成功，非常感谢 Tuan！ snack.expo.io/KJl_IKU3D – tuan.tran 29 分钟前

React Native 如何使 Carousel 重定向到选择了相应 ID 的另一个页面

React Native How to make a Carousel redirect to another page with the respective id selected

javascript

carousel

reactjs

react-native

react-navigation