我不明白 React 导航行为

Question

我在反应本机（打字稿）应用程序中有这个功能：

import { LoginProps } from '../types';

export const signOut = async (auth: Auth, nav: LoginProps['navigation'], setUser: any) => {
    try {
        await auth.signOut();
        nav.navigate('Login');
        setUser(null);
    } catch (error) {
        console.log(error);
    }
}

此功能按预期工作，但如果我评论或删除此行：

await auth.signOut();

，
我收到此错误：

The action 'NAVIGATE' with payload {"name":"Login"} was not handled by any navigator.

如果我尝试仅导航而不在函数中执行任何其他操作，也会发生同样的情况。
我不明白这两行是如何链接的以及为什么第一行对于第二行的工作是必要的......

我在测试要解决的问题时遇到了这个问题这篇文章。

这是我的类型：

export type RootStackParamList = {
    Home: undefined;
    Login: undefined;
    Register: undefined;
    Game: { roomId: string | null };
}

export type NavigationProps<T extends keyof RootStackParamList> = {
    navigation: StackNavigationProp<RootStackParamList, T>;
}

export type HomeProps = NavigationProps<'Home'>;
export type LoginProps = NavigationProps<'Login'>;
export type RegisterProps = NavigationProps<'Register'>;
export type GameProps = NavigationProps<'Game'>;

Answer 1

请看这里：https://reactnavigation.org/docs/auth-flow

我认为只有这一行才能导航到登录

await auth.signOut();

不是这一行：

nav.navigate('Login');

因为如果 auth = null，则

Navigator

自动选择

LoginScreen

。所以代码

nav.navigate('Login');

是多余的，你不需要它。

这就是为什么您无法通过注释此行来导航到

Login

await auth.signOut();