Question

我正在尝试从登录屏幕导航到主屏幕，下面是我得到的错误。

未定义不是评估对象（_this.props.navigation.navigate（））

以下是 login.js：

export default class Login extends Component<{}>{

  static navigationOptions = {
     header: null
   }

  login = () => {
    alert('login');
    this.props.navigation.navigate('Tabs');
  }

  render (){
    return (
      <View style={styles.container}>
        <ImageBackground source={require('../resources/images/background_image.png')} style={styles.backgroundImage} >
            <Image source={require('../resources/images/app_logo.png')} style={styles.logo}/>
              <View style={styles.formContainer}>
                  <TextInput style={styles.textInput} placeholder='Username'
                      placeholderTextColor={textInputConfig.placeholderTextColor} autoCapitalize='none'/>
                  <TextInput style={styles.textInput} placeholder='Email'
                      placeholderTextColor={textInputConfig.placeholderTextColor} autoCapitalize='none'/>
                  <TextInput style={styles.textInput} placeholder='Password'
                      secureTextEntry={true} placeholderTextColor={textInputConfig.placeholderTextColor} autoCapitalize='none'/>
                  <Button raised title='SIGN UP' buttonStyle={styles.signupButton}
                      containerViewStyle={styles.signupButtonContainer} onPress={this.login} />
             </View>
        </ImageBackground>
      </View>
    );
  }
}

----

请注意，正在调用登录功能，甚至显示警报，但我仍然收到错误。谁能告诉我们这里有什么问题？

修改

Router.js ：

import React from 'react';
import { TabNavigator, StackNavigator } from 'react-navigation';
import { Icon } from 'react-native-elements';

import Home from '../screens/Home';
import MyCards from '../screens/MyCards';
import AddCard from '../screens/AddCard';
import Login from '../screens/Login.js';


export const MainScreenNavigator = TabNavigator({
 Home: {
   screen: Home,
  navigationOptions : {
     tabBarLabel: 'Home',
     tabBarIcon: ({ tintColor }) => <Icon name="account-circle" size={35} color={tintColor} />
   },
 },
 MyCards: {
   screen: MyCards,
   navigationOptions : {
    tabBarLabel: 'My Cards',
    tabBarIcon: ({ tintColor }) => <Icon name="list" size={35} color={tintColor} />
  },
 },
},
 {
   tabBarPosition: 'bottom',
   animationEnabled: true,
   tabBarOptions: {
     activeTintColor: '#e91e63',
   },
 },
);

export const AppNavigation = StackNavigator({
    LoginScreen: { screen: Login },
    Tabs: { screen: MainScreenNavigator},
    AddCard: { screen: AddCard }
  },
  {
   headerMode: 'screen'
 });

React Navigation Undefined不是对象

0 个答案: