使用Redux时React-Navigation不起作用

Question

我有一个只有一个按钮和导航的简单应用程序，一切都很好。然后我添加了redux来处理图像，现在单击图像时我想重定向到新页面，但是出现错误：ReferenceError：导航未定义。

一切正常，直到存储并添加了redux。

导航：

export default class KittensApp extends React.Component {
    render() {
        return (
            <Navigator />
        );
    }
}

const AppStackNavigator = createStackNavigator({
    Home: {
        screen:enter code here KittenList
    },
    Profile: {
      screen: KittenInfo
    }
});

const Navigator = createAppContainer(AppStackNavigator);

handlePress(item){
    console.log(this.props.navigation);
    this.props.navigation.navigate('Profile');
  }

  renderItem = ({ item }) => {
    const uris = 'data:image/png;base64,' + item.image;
    return (
      <TouchableOpacity style={{flex: 1, flexDirection:'column', justifyContent: 'center'}}
      onPress={()=> this.handlePress(item)}>
        <Image style = {{width: 300, height:200, margin: 5}}
          source={{ uri: uris}} 
        />
        <View style={{flex:1, justifyContent: 'center', alignItems: 'center'}}>
          <Text>{item.name}</Text>
        </View>
      </TouchableOpacity>
    )
  }