undefined 不是对象 this.props 错误

Question

I am trying to follow this ( link ) tutorial for navigating between sign up and login pages. Part way through it I get the error :

I am getting this error when I try to add the following button in Login.js :

<Button
   title='Go to SignUp'
   onPress={() => this.props.navigation.navigate('SignUp')}
/>

This is before the part where the article talks about 'Managing authentication flow'. I have implemented all the code before this section but I'm not able to proceed further. Please help.

Here's a link to the expo snack. https://snack.expo.io/rkuPjzLRr

Answer 1

Because there's no props in your Login (that identifier isn't declared anywhere). Instead of

export default function Login() {

do

export default function Login(props) {

Answer 2

the problem says that he can't find navigation in the props, be sure that your component is in the stack navigator your component can't get the navigation prop without it

const AuthNavigation = createStackNavigator(
  {
    Login: { screen: Login },
    Signup: { screen: Signup }
  },
  {
    initialRouteName: 'Login'
  }
)