CODEWITHSUNDEEP
javascriptreact-native
Raghu
Raghu

Reputation: 125

TypeError: this.props.navigation.getParam is not a function while passing parameter using ReactNative

I am getting an error while accessing parameter by the getParam method like following .

    const source = this.props.navigation.getParam("source","0")
    const doFollow = this.props.navigation.getParam("doFollow","")

I have passed the parameter using the following method

this.props.navigation.navigate('Details', {otherParam:"anything"})

Upvotes: 2

Views: 6995

Answers (6)

Sohan Rahman
Sohan Rahman

Reputation: 1

props.navigation.getParams(**source**) is not working in V4

props.route.params.**source** in at V5

V5:

without object destructuring -->

function(props)
{
   props.navigation.goBack() //For navigation
   props.route.params.**source** //For params
}

with object destructuring -->

function({navigation, route})
{
   navigation.goBack()    //FOR navigation
   route.params.**source**   //FOR params
}

Upvotes: 0

Ravi Kant Bagoria
Ravi Kant Bagoria

Reputation: 69

If you want to send data(ex. JSON) from one class to another in React-Native.

this.props.navigation.navigate('Detail Screen', json)

Here json is the JSON object with key-value. Ex.

    { id: 1234, name: "Dean", age: 30}

In the receiver class/ Navigated Class in render

     const name = this.props.route.params.name;
     const age = this.props.route.params.age;

NOTE:Please make sure data is send as key value {key: value}

Upvotes: 1

Bhupesh Kumar
Bhupesh Kumar

Reputation: 256

If You are using the latest version of react navigation(i.e. Version 5.0 or more). You can simply use this.props.route.params.YOUR_PARAMETER_KEY for passing parameters

Upvotes: 1

Shing Ho Tan
Shing Ho Tan

Reputation: 951

It depends on your react-navigation version that you are using.

In v4

this.props.navigation.getParam('source')

In v5

this.props.route.params.source

Upvotes: 11

pinman
pinman

Reputation: 163

It may not fit your example completely but i'm passing/retrieving data like this:

this.props.navigation.navigate('DisplayPage', { meetId: item.ID })

Then on receiving page

props.navigation.state.params.meetId

Upvotes: 1

Dipansh Khandelwal
Dipansh Khandelwal

Reputation: 626

Assuming that you are using the latest react-navigation. You are making a small mistake.

Try removing the second parameter from the function.

let source = this.props.navigation.getParam("source")
let doFollow = this.props.navigation.getParam("doFollow")

if(!source) source = "0"
if(!doFollow) doFollow = ""

Upvotes: 0

Related Questions