React native 无法读取属性'；导航'；未定义的

我尝试使用导航操作导航，但由于某些原因，它无法导航。 我正在尝试从登录屏幕转到主屏幕

登录筛选：

  constructor(props){
    super(props)
    this.state = {
      email: '',
      password: '',
      status: '',
    }

    this.handlePress = this.handlePress.bind(this)
  }

  handlePress(){
    firebaseRef.auth().signInWithEmailAndPassword(this.state.email, this.state.password).then(function(firebaseUser){
      //Success, move to homepage.
      const resetAction = NavigationActions.reset({
        index: 0,
        actions: [
          NavigationActions.navigate({ routeName: 'Home'})
        ]
      })

      this.props.navigation.dispatch(resetAction) <-- SAYS NAVIGATION IS UNDEFINED 
    }).catch(function(error){
      //Failed to log in, print error.
      console.log(error)
    });
  }

const { navigation } = this.props.navigation;

这是app.js，我在这里设置导航：

import React from 'react';
import { AppRegistry } from 'react-native';
import { StackNavigator, TabNavigator } from 'react-navigation';
import Ionicons from 'react-native-vector-icons/Ionicons';

import LoginScreen from './app/screens/LoginScreen';
import RegisterScreen from './app/screens/RegisterScreen';
import HomeScreen from './app/screens/HomeScreen';
import FriendsScreen from './app/screens/FriendsScreen';

const Stylelist = StackNavigator({
  Login:{
     screen: LoginScreen,
     navigationOptions: ({navigation}) =>({
       header: null,
     }),
  },
  Register:{
      screen: RegisterScreen,
      navigationOptions: ({navigation}) =>({
        header: null,
      }),
  },
  Home:{
    screen: TabNavigator({
      Home: {
        screen: HomeScreen,
        navigationOptions: ({ navigation }) => ({
          title: 'Home',
          tabBarIcon: ({ tintColor, focused }) => (
            <Ionicons
              name={focused ? 'ios-home' : 'ios-home-outline'}
              size={26}
              style={{ color: tintColor }}
            />
          )
        }),
      },
      Friends: {
        screen: FriendsScreen,
        navigationOptions: ({ navigation }) => ({
          title: 'Friends',
          tabBarIcon: ({ tintColor, focused }) => (
            <Ionicons
              name={focused ? 'ios-people' : 'ios-people-outline'}
              size={26}
              style={{ color: tintColor }}
            />
          )
        }),
      },
    }),
    navigationOptions: ({ navigation }) => ({
      title: 'Home',
      headerStyle: {backgroundColor: "#553A91"},
      headerTitleStyle: {color: "#FFFFFF"},
    }),
  }
});
export default Stylelist;

我怎样才能修好它呢？

应该是

const { navigate} = this.props.navigation;

或

实际上，你们在道具中得到的是导航对象，其中有导航方法

const { navigation } = this.props.navigation;

这一点很重要

this.props.navigation.navigation

它表示在导航对象中查找导航属性，而导航对象实际上不存在，因此给出了

未定义的

。我希望这能消除你的疑虑。

我也有这个问题。 当然，我使用了

setTimeout

。可能有人有这个问题，所以这是一个很好的提醒

只使用

让that=this

componentDidMount() {
    let that = this ;
    setTimeout(function () {
        let toHome = StackActions.reset({
            index: 0,
            actions: [NavigationActions.navigate({routeName: 'MainScreen'})]
        });
        that.props.navigation.dispatch(toHome);
    },3000);
}

确保您的函数与此绑定

onPress={()=>this.handlePress()}

反而

onPress={()=>this.handlePress.bind(this)}

你能不能解释一下/给我一个信息来源，为什么会这样？
componentDidMount() {
    let that = this ;
    setTimeout(function () {
        let toHome = StackActions.reset({
            index: 0,
            actions: [NavigationActions.navigate({routeName: 'MainScreen'})]
        });
        that.props.navigation.dispatch(toHome);
    },3000);
}

onPress={()=>this.handlePress()}

onPress={()=>this.handlePress.bind(this)}