3

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?

kousic
  • 31
  • 2

2 Answers2

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

Himanshi Patel
  • 66
  • 6
  • Thank you for your response, but I want to know, how to write the deep linking configuration and I didn't understand your answer can you please elaborate. – kousic Dec 16 '21 at 09:01
0

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

Balu
  • 124
  • 8