如何为 Switch Navigator 设置后退按钮

Question

我正在开发一个 React Native 程序，我在其中使用 Switch Navigator。但我想知道如何为 Switch Navigator 设置后退按钮。我不想使用堆栈导航器。这是我的导航页面代码

            import createAnimatedSwitchNavigator from 'react-navigation-animated-switch';
            import {createAppContainer } from 'react-navigation';
            import { Transition } from 'react-native-reanimated';
            import React from 'react';

            import Login   from "./Login/Login";
            import SignUp  from './SignUp/SignUp';


            //====================================================

            //====================================================
            const Navigate = createAnimatedSwitchNavigator({


            Login:         {screen:Login},
            SignUp:        {screen:SignUp},

            },
            {
                transition: (
                <Transition.Together>
                    <Transition.Out
                    type="slide-left"
                    durationMs={200}
                    interpolation="easeIn"
                    />
                    <Transition.In type="fade" durationMs={300} />
                    </Transition.Together>
                ),
            }
            )

            export const AppContainer = createAppContainer(Navigate)

Answer 1

"The purpose of SwitchNavigator is to only ever show one screen at a time. By default, it does not handle back actions and it resets routes to their default state when you switch away. This is the exact behavior that we want from the authentication flow."

来自 React Navigation 文档：https://reactnavigation.org/docs/en/switch-navigator.html

SwitchNavigator 旨在处理身份验证（登录、注销和注册）。离开身份验证屏幕后，您不希望用户跳回该屏幕。因此 SwitchNavigator 删除了该功能。如果您想要后退按钮或功能，请使用除 SwitchNavigator 之外的任何导航器。

"createAnimatedSwitchNavigator" 与 createSwitchNavigator 相同，除了动画。所以它也没有后退功能。

Answer 2

申请 resetOnBlur:false

例如

const App = createSwitchNavigator({
AppTabNavigator:AppTabNavigator,
  RootStack:RootStack,
},{
  initialRouteName:'AppTabNavigator',
  resetOnBlur:false,
  backBehavior:'history'
})

此外，检查：https://reactnavigation.org/docs/en/switch-navigator.html

如何为 Switch Navigator 设置后退按钮

how to set up Back button for Switch Navigator

android

button

back

navigator

react-native