CODEWITHSUNDEEP
iosreact-nativedeep-linkingios-universal-linksstack-navigator
JESTER 2-6
JESTER 2-6

Reputation: 113

Prevent stack navigator from automatically routing to screen when opening react native app with a deep link

I have a react native iOS app, rigged to open via a short url generated via our own service. URL looks like my-site.com/slr/xxxxxxxxx. The URL is handled via the following code.

Linking.canOpenURL(url).then(supported => {
  if (supported) {
    // my logic
  }
});

Now the issue is, the stack navigator of the app attempts to read the url and redirect it to a screen named xxxxxxx, which doesn't exist, and therefore creates the following error.

The action 'NAVIGATE' with payload {"name":"slr","params":{"initial":true,"screen":"xxxxxxxxxxxx"}} was not handled by any navigator.

How can I block this automatic redirect without changing the URL or adding a screen with the route xxxxxxx?

I have tried adding a route the following way, but the stack navigator still redirects after the callback, so that doesn't work either.

    DeepLinking.addRoute('/testurl.com/#/sign-in', response => navigate(‘signIn’))

Upvotes: 0

Views: 1225

Answers (1)

Michael Bahl
Michael Bahl

Reputation: 3669

Did you define your deep lining in the Navigation container like this?

const linking: LinkingOptions = {
  config: {
    screens: {
      TabNavigator: {
        screens: {
          initialRouteName: 'YourInitRouteTab',
          YourInitRouteTab: {
            screens: {
              YourScreen: {
                path: 'screen/path/parameter?',
              },
            },
          },
        },
      },
    },
  },
};

<NavigationContainer
  linking={linking}
  ...

Upvotes: 1

Related Questions