如何通过 React Navigation 将导航道具传入功能组件屏幕？

Posted 2023-03-15

【中文标题】如何通过 React Navigation 将导航道具传入功能组件屏幕？

【英文标题】：How to pass in navigation props into a functional component screen through React Navigation?

【发布时间】：2020-08-29 00:33:48

【问题描述】：

我有一个带有自定义“任务”的 React Native FlatList 的功能组件屏幕。我希望能够从一个任务导航到另一个功能组件“TaskEditScreen”，并将一些道具传递给屏幕。

<TouchableOpacity onPress=()=>navigation.navigate('Task Edit')>
   <Feather
      name="edit"
      size=35
      color="black"
      style=
         margin: 5
          
   />
</TouchableOpacity>

onPress 功能有效，它可以将我导航到正确的屏幕，但我如何也将某种道具或数据传递到此屏幕？

【参考方案1】：

文档：https://reactnavigation.org/docs/params

<TouchableOpacity onPress=() =>  navigation.navigate('Task Edit', someParam: "someValue") >
  <Feather
    name="edit"
    size=35
    color="black"
    style=
      margin: 5
    
  />
</TouchableOpacity>