Reputation: 245
I have a configuration issue with deep/universal links when I want to open a screen that is in another Stack.
Here is the screen composition:
- NavigationContainer
- AppStack (stack navigator)
- TabsNavigator (BottomTabNavigator)
- LoadListScreen (screen component)
- ...
- LoadListScreen (screen component)
- ...
I have a NavigationContainer, inside which I have a Stack navigator (AppStack). Nested within, I have a BottomTabNavigator and a screen for lot details. In the BottomTabNavigator, I have a screen that displays a load list.
Why have LoadDetails in the same navigator as the TabsNavigator? It’s to hide the bottom Tab bar when on the lot details screen (https://reactnavigation.org/docs/hiding-tabbar-in-screens).
const linking = {
prefixes: ['https://example.com'],
config: {
screens: {
AppStack: {
screens: {
TabsNavigator: {
screens: {
LoadListStack: {
screens: {
LoadListScreen: {
screens: {
LoadDetails: {
path: 'loadlist/:id' // This is not working because my screen is not inside LoadListStack
},
},
},
},
}
},
LoadDetails: 'loadlist/:id', // this is working but it's not what I want (because the user can't go back to the list
}
}
}
} };
My goal when I open a link: https://example.com/loadlist?=XYZ is to open the LoadDetails screen via the LoadListScreen. This allows the user to go back and return to the lot list (LoadListScreen).
I'm using:
Do you need more information?
Do you have a solution to go through LoadListScreen before displaying LoadDetails? (knowing that they are in two different Stacks)
Upvotes: 1
Views: 54