CODEWITHSUNDEEP
reactjsnavigationnative
paferdez
paferdez

Reputation: 31

React Native Navigation, how do you pass and use Props between Class Components?

export default class LoginScreen extends React.component{

render () {
     return (
         <Button = {()=>this.props.navigation.navigate('Home', {number: 5} />
      )
}

}

class HomeScreen extends React.Component { render(){ return( {this.props} // I would like to display the number passed ) } }

Upvotes: 1

Views: 877

Answers (2)

paferdez
paferdez

Reputation: 31

I found the answer, thank you so much for the help. To display I used {this.props.route.params.name}

Upvotes: 1

Asad
Asad

Reputation: 573

Initialise:-

constructor(props) {
    super(props);
    this.params = this.props.navigation.state.params;
}

Retrieve data:-

console.log(this.params.name);
console.log(this.params.about);

If you are showing in any element, you also show like

<Text>{this.params.name}</Text>

Here is the complete example code. Maybe it will help you to understand it

https://www.google.com/amp/s/aboutreact.com/react-native-pass-value-from-one-screen-to-another-using-react-navigation/amp/

Upvotes: 0

Related Questions