React Native，将导航传递给无状态平面列表组件答案

【问题标题】：React Native, Passing Navigation to Stateless Flatlist componentReact Native，将导航传递给无状态平面列表组件
【发布时间】：2019-07-02 03:04:12
【问题描述】：

目前我有：

return(
  <View style={{flex: 1, paddingTop:20}}>
    <FlatList
      data={this.state.dataSource}
      renderItem={(data) => <EventCard eventinfo = {data.item} navigation= 
           {this.props.navigation}/>}
      keyExtractor={(item) => item.eventname}
    />

和

const EventCard = ({eventinfo, navigation}) => {
return (
    <TouchableOpacity style={{backgroundColor: 'transparent'}} onPress= {() 
     => navigation.navigate('CurrRes')}>

我不明白为什么不能在我的事件卡中评估导航，并且导航不起作用。任何帮助，将不胜感激。

（是的，在第一个文件中导入了导航，项目运行但在按下其中一个平面列表项时崩溃）

我得到的错误是

undefined is not an object (evaluating 'navigation.navigate')

【问题讨论】：

这个问题你解决了吗？

标签： react-native react-native-flatlist react-native-navigation stateless

【解决方案1】：

这是一个我发现可以更好地解释它的例子。您需要以不同于普通函数的方式访问道具。

const Child = (props) => {
return (
  <div style={{backgroundColor: props.eyeColor}} />
 )
}

https://medium.com/@PhilipAndrews/react-how-to-access-props-in-a-functional-component-6bd4200b9e0b

【讨论】：

这是反应，我在反应本机工作，所以没有 div 标签，我也可以在这里做 {eventinfo.eventname}，我只是不知道如何获得导航出来所以我可以做navigation.navigate

【解决方案2】：

没关系，我必须使用导航导出实际列表，以便其每个嵌套的无状态组件都可以导航。对不起！

【讨论】：