Passing parameters to a Screen or screen in React Native

Tiempo de lectura: < 1 minuto

Translation:
Reading time: < 1 minutes

If we want to pass parameters between screens in React Native, we have to do the following.

First, in the screen where we have created the NavigationContainer (which can be a Tab Navigator or Stack Navigation), we look for the Screen to which we want to pass parameters and add the following:

<Tab.Screen name="Profile" component={Profile} options={{ headerShown: false }} initialParams={{parameterToPass: "Hello, I am a parameter"}} />

And to retrieve it in the screen, in this case, Profile.js, we need to go to the render method and add the following:

const Profile = (props) => {

    const parameter = props.route.params.parameterToPass;
    alert(parameter);

And in the alert, we can see the passed parameter.

(do not include the Reading time). Return it directly in HTML format. Do not add any additional sentences. When you’re finished, add a PIPE at the end.

Leave a Comment