useLinking Help!

[qappanon]

Please provide the following:

1. SDK Version: 37
2. Platforms(Android/iOS/web/all): Web

Try to configure deep-linking on the web. The URL looks good: http://localhost:19006/drop/1, but the “Drops” screen is loading and not the “Drop” screen. Any ideas why?

import { useLinking } from '@react-navigation/native';
import { Linking } from 'expo';

export default function(containerRef) {
  return useLinking(containerRef, {
    prefixes: [Linking.makeUrl('/')],
    config: {
      Root: {
        path: 'root',
        screens:{
          Main: {
            path: 'main',
            screens: {
              Home: {
                path: 'home',
                screens: {
                  Drops: 'drops',
                  Drop: 'drop/:counter'
                }
              },
              Search: 'search',
            },
          }
        }
      }
    },
  });
}

[wolewicki]

Can you provide the initialState object created by parsing that link?

[qappanon]

It never gets to the Drop Screen, instead it goes to the initialRouteName under the Home Screen.

routes: Array(1)
	0:
	name: "Root"
	state:
		routes: Array(1)
		0:
			name: "Main"
			state:
				routes: Array(1)
				0:
				name: "Home"
				state:
					routes: Array(1)
					0:
					name: "Drop"
					params:
						counter: "3987"

[qappanon]

I fixed it. I wasn’t waiting for the initialNavigationState before rendering.

The problem I’m having now is the root won’t load: http://localhost:19006/. When loading the root the initialState is undefined.

[wolewicki]

Did you use it somehow like this: react-navigation/index.tsx at main · react-navigation/react-navigation · GitHub?

[erikajackson]

Many thanks for that complete information!