CODEWITHSUNDEEP
javascriptreactjsreact-nativeexporeact-navigation
Victor Molina
Victor Molina

Reputation: 2641

React Navigation 5, undefined params

I have a RootNavigator (Stack) within there is a TabNavigator. In the TabNavigator there are multiples Screens, including a Stack Navigator in which there is a screen called "Profile".

What I am trying to do is just send a param from a screen of the RootNavigator, to Profile.

Root Navigator's Screen

// Navigate to the profile screen
navigation.navigate("Profile", {
  isUploadingContent: true,
});

It navigates correctly to the screen, but when I get the route params they are undefined.

Profile.js

  useEffect(() => {
    // Check if content is uploading...
    if (props.route.params.isUploadingContent) {
      toastRef.current.show(
        "Your photo will be available in a few seconds",
        3500
      );
    }
  }, []);

I have also tried to send the params as follows but getting the same result.

Root Navigator's Screen

// Navigate to the profile screen (nested navigator)   

navigation.navigate("TabNavigator", {
  screen: "Profile",
  params: {
    isUploadingContent: true,
  },
});

Any ideas about what is going wrong here? Thanks.

Upvotes: 2

Views: 2463

Answers (1)

Victor Molina
Victor Molina

Reputation: 2641

Okey I have found the solution. It is like

navigation.navigate("TabNavigator", {
  screen: "Profile",
  params: {
    isUploadingContent: true,
  },
});

but, as in the lowest level I have a stack navigator called "Profile" in which there is other screen called the same, I have had to replace the "TabNavigator" with "Profile" and works fine.

navigation.navigate("Profile", {
  screen: "Profile",
  params: {
    isUploadingContent: true,
  },
});

Upvotes: 2

Related Questions