Unable to access route params (functional component)

user_14390956 0
Viewed 65

I am trying to pass the username from signup1 to signup 2:

handleSignUp = () => {
      console.log(this.state.username) <------------- This logs correctly 

      try {
        this.props.navigation.navigate('Signup2', {
          username: this.state.username, <------------- Passing here
        });
      } catch (error) {
        console.log(error);
      }
    }

Here is the code from Signup2:

const Signup2 = (props, route, navigation) => {

  const { username } = route.params; <----------- Trying to access it here

I get the following error:

undefined is not an object (evaluating 'route.params.username')

I have also tried this:

const { username } = props.route.params

And neither work.

How can I access the route params?

react-navigation react-native javascript
1 Answers

I believe you would need to destructure your route and navigation properties if you'd like to access them as intended.

You can go for:

const Signup2 = ({route, navigation}) => {
   const { username } = route.params
}

Or maybe:

const Signup2 = (props) => {
   const { username } = props.route.params
}
user_152997650
Related