Skip to content

Instantly share code, notes, and snippets.

@kaushal9678

kaushal9678/Linking.ts

Last active April 5, 2021 05:36
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save kaushal9678/a763e3288b7012a4350ed1e434c6e56f to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save kaushal9678/a763e3288b7012a4350ed1e434c6e56f to your computer and use it in GitHub Desktop.
Download ZIP
Raw
Linking.ts
import { LinkingOptions } from "@react-navigation/native";
const config = {
screens: {
BottomTabs: {
path: 'bottom_tabs',
screens: {
Jobs: {
path: 'jobs',
exact: true,
screens: {
Search: {
path: 'search',///:keyword/:location
params: {
keyword: (keyword: string) => `${keyword}`,
location: (location: string) => `${location}`
},
exact: true,
},
JobDetail: {
path: 'users/:screamId/',
params: {
screamId: (screamId: string) => `${screamId}`,
},
exact:true,
}
},
},
Resumes: { path: 'resume', exact: true },
Profile: { path: 'profile', exact: true },
Messages: { path: 'messages', exact: true,
screens:{
MessageDetailView:{
path:'messageDetail',
exact:true,
}
} },
Settings: {
path: 'settings', exact: true,
GetHelp: {
path: 'getHelp',
exact: true,
},
}
},
}
},
}
}
const linking = {
prefixes: ["https://www.kyadav.tech", "deeplink://"],
config,
};
export default linking;
@kaushal9678
Copy link
Author

kaushal9678 commented Apr 2, 2021

This is a Linking configuration file that will pass to NavigationContainer.

Here as you can see, I have defined paths for every route different from the page name because I have to make a path that I am getting in the deep link.

So for example

  • I have a page JobDetail in my NavigationStack but the deep link URL I get for this page is users/:screamId/. So, how our app will know that whenever I get a URL like this https://kyadav.tech/users/3242341dsf in Mail or messages Safari browser etc. I have to send this to JobDetail Page.

  • That's why we have to define our path like this

JobDetail: {
          path: 'users/:screamId/',
             params: {
               screamId: (screamId: string) => `${screamId}`,
              
             },
             exact:true,
}

here we should pass exact = true because we only open jobDetail page when the exact URL matches

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment