Sharing state between screens
When we create app containing multiple screens & data shared between screens. when one screen uses the same data of another screen then we had to make an API call for each screen, fetching the list twice. It would be better to fetch the list just once and share data between screens.
There are a few different ways we can make this better. One way is to define all the data within our application in the App component. We can then use the initialRouteParams property that React Navigation provides for our root tab navigator to assign the state to its initial route. With this approach, we can continue to pass our entire data to every other scree. This method of maintaining state is not ideal due to the fact that every screen now has access to all the data in the entire app.
State containers:
React Native applications that contain a navigation architecture generally handle data flow differently. we have stored data in the root and screen components of our apps, and we’ve passed data down from parent to child as props. we use state container to manage all of our application data in a separate external location outside of our components.This can be useful to separate the UI and data.This approach allows us to pass parts of our state to each of our screens.One approach to including a state container is to use a third-party library.
Deep linking :
deep linking means launching the app and navigating to a specific screen automatically.
A deep link bypasses the tab, stack, and drawer navigation, taking the user directly to the desired screen. This can be useful when launching your app from a webpage, a push notification, or another app.Imagine the user gets a push notification that a new contact has been added. When the user taps the notification, they should be taken directly to the profile screen for that contact, rather than having to navigate their way from the initial screen of the app.Deep links are similar to typing a URI (Uniform Resource Identifier) into a web browser. On the web, https://www.javatpoint.com might load the homepage for the website, while https://www.javatpoint.com/react-native-tutorial will load a different page. Similarly in mobile applications, we perform a deep link using a URI,where each URI generally takes us to a different screen.Using a navigation library for a mobile app helps us build our app in terms of screens– this makes it easy to connect any screen of our app to a specific URI.
A deep link bypasses the tab, stack, and drawer navigation, taking the user directly to the desired screen. This can be useful when launching your app from a webpage, a push notification, or another app.Imagine the user gets a push notification that a new contact has been added. When the user taps the notification, they should be taken directly to the profile screen for that contact, rather than having to navigate their way from the initial screen of the app.Deep links are similar to typing a URI (Uniform Resource Identifier) into a web browser. On the web, https://www.javatpoint.com might load the homepage for the website, while https://www.javatpoint.com/react-native-tutorial will load a different page. Similarly in mobile applications, we perform a deep link using a URI,where each URI generally takes us to a different screen.Using a navigation library for a mobile app helps us build our app in terms of screens– this makes it easy to connect any screen of our app to a specific URI.
