Question

我有以下路线结构：

Tab1 -> Route 1 -> Route 2 -> Tab2

当我访问Tab1并返回initialRoute时，有效路线为2而不是tabBarOnPress: ({ scene }) => { const { route } = scene; const tabRoute = route.routeName; const { routeName } = route.routes[0]; navigation.dispatch(NavigationActions.navigate({ routeName: tabRoute })); navigation.dispatch(NavigationActions.reset({ index: 0, actions: [ NavigationActions.navigate({ routeName }), ], })); }, 1。

我正在做以下事情：

Route 2

但问题是它首先显示Route 1，然后导航到std::vector<int>。

如何重置之前的标签/屏幕，因此当我切换标签时，总是直接显示初始路线。

Answer 1

问题在于，当我重置路线时，我需要传递先前routeName的导航动作（离开标签）并为下一个路线分派新的导航动作：

tabBarOnPress: ({ previousScene, scene }) => {
    const tabRoute = scene.route.routeName;
    const prevRouteName = previousScene.routes[0].routeName;

    navigation.dispatch(NavigationActions.reset({
        index: 0,
        actions: [
            NavigationActions.navigate({
                routeName: prevRouteName
            }),
        ],
    }));

    navigation.dispatch(NavigationActions.navigate({
        routeName: tabRoute
    }));
}

Answer 2

使用 unmountOnBlur 选项，它适用于所有类型的导航器、堆栈导航器、抽屉导航器、底部标签导航器

在导航器屏幕的options prop中传递unmountOnBlur

Answer 3

您可以试试这样的重置道具：

tabBarOnPress: ({ scene }) => {
    const { route } = scene;
    const tabRoute = route.routeName;
    const { routeName } = route.routes[0];

    navigation.dispatch(NavigationActions.reset({
        index: 1,
        actions: [
            NavigationActions.navigate({ routeName }),
            NavigationActions.navigate({ routeName: tabRoute })
        ],
    }));
},

修改：如果没有解决问题，您可以查看this github issue with some workarounds

React Navigation TabNavigator：重置选项卡更改上的上一个选项卡

3 个答案: