How to write Deep link in React Native

Question

I have Implemented Deep Linking in react native. My routing is done like this.

AuthNavigator (Stack Navigator)

• Login
• Signup
• Home (Stack Navigator)

Home navigator (Stack Navigator)

• EquipmentBooking
• EquipmentStatus

I want to navigate to EquipmentStatus screen , so I created deep linking config like this

 const config = { screens: { Home: { screens: { EquipmentStatus: 'equipmentstatus' } } } }

but when I click on the notification, it is opening the app (when it is closed) but it's not navigating to a particular screen. when the app is in open, it does nothing.

so can anyone suggest to me how to write a deep linking config for this scenario?

Answer 1

To navigate particular screen

render() {
   return (
      <AppNavigator
         // ...
         uriPrefix={‘demo://’}
       />
   );
}




 export default createStackNavigator(
  {
    First: {
      screen: First,
      path: 'first/:firstId',
    },
    Second: {screen: Second, path: 'second/:secondId'},
    Third: {screen: Third, path: 'third'},
  },
  {
    initialRouteName: 'First',
  },
);
        

Paste this url to browser: demo://home/second/42

Answer 2

Follow This https://dev.to/techtalks/deep-linking-in-react-native-app-with-react-navigation-v5-41id

It is clearly explained. Check the react-navigation documentation https://reactnavigation.org/docs/deep-linking and https://reactnavigation.org/docs/configuring-links .

you can find examples some also https://github.com/react-navigation/deep-linking-example

https://github.com/eugenehp/react-native-deep-linking