React Navigation Reset Can I add parameters?

I am still a newbie to navigate responsive. I want to reset the route information after successful login. However, there are some parameters, such as login information, that I want to pass to the main page.

import { NavigationActions } from 'react-navigation'

const resetAction = NavigationActions.reset({
  index: 0,
  actions: [
        NavigationActions.navigate({ routeName: 'Profile',
                params:{user:this.state.username}})
      ]
  })
    this.props.navigation.dispatch(resetAction)

      

On the Profile page I want to access the options, so I use this:

constructor(props){
super(props)
this.state = { username: this.props.navigation.state.params.user, 
  }

      

but I got: undefined is not an object (score "_this.props.navigation.state.params.user") in the console log. May I know how can I get the parameters? Thanks you

+3


source to share


2 answers


You can pass parameters to reset action of inline stack navigator like: -

const resetAction = NavigationActions.reset({
            index: 0,
            actions: [ 
                NavigationActions.navigate({ 
                    routeName: 'ScreenName',      // name of the screen you want to navigate
                    params: {
                        paramsKey: paramsValue   // this second parameter is for sending the params
                    } 
                })
            ],
});
this.props.navigation.dispatch(resetAction);

      



And get the parameter value in the second screen from the navigation state parameters like this: -

static navigationOptions = ({navigation, screenProps}) => {
    const params = navigation.state.params || {};   // You can get the params here as navigation.state.params.paramsKey

    console.log("CompareScreen product_id:", params.paramsKey);
}

      

+5


source


You are passing parameters using username

as a key. So when you retrieve it, your code should look like this:

Step 1: passing parameters

this.props.navigation.navigate('Your-Screen_name',{ username: 'Lucy' })

      



Step 2: Get Params

this.state = { 
    username: this.props.navigation.state.params.username, 
}

      

+1


source







All Articles