Итак, у меня есть следующая структура навигации:
NavigationContainer
--Tab.Navigator
----Tab.Screen (Home)
------Stack.Navigator
--------Stack.Screen (Overview)
--------Stack.Screen (Goals)
--------Stack.Screen (Economy)
----Tab.Screen (Stats)
------Stack.Navigator
--------Stack.Screen (Overview)
--------Stack.Screen (Economy Page)
--------Stack.Screen (Consumption Page)
----Tab.Screen (Challenges)
----Tab.Screen (Data)
Теперь проблема в том, что я хочу, чтобы все навигаторы стека сбрасывались на страницу обзора по умолчанию при изменении вкладок. Это означает, что, например, если вы находитесь в обзоре на главном экране, вводите экран стека целей, меняете вкладку на статистику, а затем go обратно на главную вкладку, вы снова возвращаетесь к обзору, но прямо сейчас он все еще будет в целях screen.
Я пробовал использовать метод CommonActions из реакции навигации следующим образом:
navigation.addListener('blur', () => {
console.log('Home screen changed');
navigation.dispatch(
CommonActions.reset({
index: 1,
routes: [
{ name: HomeScreens.Start },
],
}),
);
});
Но проблема в том, что элемент навигации ссылается на родительский Navigator. Это означает, что сброс также происходит, если вы находитесь в каждом навигаторе стека, чего я не хочу.
Сейчас мой рабочий стол выглядит так:
export function HomeScreen({ navigation }:any) {
return (
<NavigationContainer independent = {true} >
<Stack.Navigator initialRouteName={HomeScreens.Start} headerMode = "none">
<Stack.Screen name = {HomeScreens.Start} component={StartPage} />
<Stack.Screen name= {HomeScreens.Economy} component={EconomyPage} />
<Stack.Screen name= {HomeScreens.Goal} component={GoalPageFunc} />
</Stack.Navigator>
</NavigationContainer>
);
}
Можно ли здесь что-то сделать, чтобы сбросить навигатор стека при изменении вкладок, но не при навигации в навигаторе стека?